Add a New Item to a List
So we just talked about how to display data in a visual web part, now let’s talk about making customized forms for the user to enter data into a list.
Sample Data
First, I created an empty list in honor of my caffeine addiction.
In addition to the Title column, this list has some extra columns with different data types.
Our task is to make a simple un-styled form with controls that correspond to the columns.
Once the user clicks the button, the item gets added to the list.
Preliminary Steps
1. Create a new SharePoint 2010 Project (Visual C#) in Visual Studio 2010, or use an existing one.
2. Add a Visual Web Part to the project.
3. Open up the UserControl (the .ascx file) and add the appropriate form controls (text boxes, drop down choices, checkboxes, etc.) that correspond to the columns in the list.
|
1 2 3 4 5 6 7 8 |
<asp:TextBox ID="TitleTextBox" runat="server"></asp:TextBox> <asp:DropDownList ID="SizeDropDownList" runat="server"> <asp:ListItem Text="Tall" Value="Tall" Selected="True" /> <asp:ListItem Text="Grande" Value="Grande" /> <asp:ListItem Text="Venti" Value="Venti" /> </asp:DropDownList> <asp:TextBox ID="CaloriesTextBox" runat="server"></asp:TextBox> <asp:CheckBox ID="SeasonalCheckBox" runat="server" /> |
4. Add a button control with an OnClick attribute and function name.
|
1 |
<asp:Button ID="SaveBtn" runat="server" Text="Save" OnClick="Add_New" /> |
5. Open the .ascx.cs file (F7).
Add a New Item to the List
1. Create a method for the OnClick event. Be sure to place it inside the class brackets.
|
1 2 3 4 |
//OnClick Event for the Save button protected void Add_New(Object sender, EventArgs e) { //The following code goes in here! } |
2. Select the list. First select the site, then indicate which list with SPList. Alternatively, you can use SPListItemCollection, select the Items, and adjust the following steps accordingly.
|
1 2 3 |
//Select the list SPWeb thisWeb = SPContext.Current.Web; SPList sampleList = thisWeb.Lists["Starbucks"]; |
3. Add a new (empty) List Item to the list. If you’re using SPList, use the AddItem() method; if using SPListItemCollection, then use Add().
|
1 2 |
//Add a new item to the list SPListItem item = sampleList.AddItem(); |
4. Set the values for each of the columns. Assign to each column in that item to the data from each corresponding form control.
|
1 2 3 4 5 |
//Store values entered into the textbox item["Title"] = TitleTextBox.Text; item["Size"] = SizeDropDownList.SelectedValue; item["Calories"] = Convert.ToInt32(CaloriesTextBox.Text); item["Seasonal"] = SeasonalCheckBox.Checked; |
5. Finally, call the Update() method to the item. Don’t forget this step!
|
1 2 |
//Finally, save! item.Update(); |
6. Optionally, you can clear the text boxes, or send the user to the list view. Or you could display a success message, but just give the user some indication that the action succeeded.
|
1 2 |
//In this example, we will send the user to the list view Response.Redirect("http://localhost/sample/Lists/Starbucks/AllItems.aspx"); |
Final Steps
- Package and deploy the project.
- If necessary, navigate to the site collection and activate the feature with the visual web part.
- Create a new web part page or edit an existing one. When you click insert a web part, the visual web part is under the Custom category.
- Add the visual web part to the page and save.
