Creating the base Visual Web Part
We’ve now have a very simple Web part that we can build, deploy, and add to our pages in SharePoint. Of course, it won’t show anything, but this it shows how simple it is to get a Web part skeleton setup to a compiled, deployable and usable state. Let me explain some of important files we’ll focus on:
All the other files that are in your project are necessary for the Web part to function, however you don’t need to touch any of other files to get a custom WebPart (even at a very customized level) working. For now, just focus on the MyWebPart.cs, MyWebPartUserControl.ascx and MyWebPartUserControl.ascx.cs files. Add some functionality
protected override void OnPreRender(EventArgs e) { base.OnPreRender(e); lbl_MySelection.Text = “Please make a selection.”; }
We should now see some text that says, “Please make a selection.” This demonstrates how and where to add custom code to interact with our UserControls’ form controls (in this case our lbl_MySelection label). Web Part Properties When you edit a Web part, and the Web part editor pops up in your browser, each one of those options are called properties. We can add our own properties and in real development environments they’re not a novelty but a necessity Before we begin with the code, it’s important to understand that there are two major categories to Web part properties:
Creating Standard Toolbox Properties
[WebBrowsable(true), Category("Miscellaneous"), Personalizable(PersonalizationScope.Shared), WebDisplayName("Enter some text")] public string CustomTextProp { get; set; } The Category seen here can be any existing category within the Web part editor tool pane, or you can type your own custom category. The WebDisplayName option is what the label will say above the property. And of course, the final line is the actual property. If we deploy our project now, we will see our property show up in the Web part tool pane when editing the Web part, but it simply is a dummy property area. It doesn’t do anything because we haven’t tied the property to our MyWebPartUserControl. Let’s do that now…
public MyWebPart WebPart { get; set; } This will allow us to reference our other MyWebPart.cs class in this ascx code-beind class and ultimately expose the tool pane properties to us.
protected override void CreateChildControls() { MyWebPartUserControl control = Page.LoadControl(_ascxPath) as MyWebPartUserControl; if (control != null) control.WebPart = this; Controls.Add(control); } } This looks for our user control on the page and it’s not null, we set the WebPart property (which we created in the previous step). Then we add the usercontrol to the controls collection. 5. Switch back again to the MyWebPartUserControl.ascx.cs file. Locate the OnPreRender method and replace it with the following: protected override void OnPreRender(EventArgs e) { base.OnPreRender(e); if (this.WebPart != null && this.WebPart.CustomTextProp!=null) { lbl_MySelection.Text = this.WebPart.CustomTextProp.ToString(); } } This is the final piece to the puzzle. We’re setting the text field within our Web parts’ user control to the tool pane’s property text field. Of course, you can do more than just text field type properties (the following code would be implemented in yourMyWebPart.cs file:
[WebBrowsable(true), Category("Miscellaneous"), Personalizable(PersonalizationScope.Shared), WebDisplayName("Checkbox Option Text")] public bool CustomCheckboxProp { get; set; }
public enum ddlEnum { option1, option2, option3 } [WebBrowsable(true), Category("Miscellaneous"), Personalizable(PersonalizationScope.Shared), WebDisplayName("Dropdown List Display Text")] public ddlEnum ddlProp { get; set; } As you can see so far, the standard tool pane properties are kind of limited; especially the dropdown list: we’re tied to the enumeration. What if we wanted some SharePoint list data feeding that dropdownlist Control? To create fully customized tool pane properties, we need to create our own “EditorPart” and here’s how to do it:
Interested in mastering SharePoint Training? Enroll now for FREE demo on SharePoint Training.
Creating custom EditorPart properties We’re going to create our own custom DropDownList control EditorPart that feeds in some values from a custom SharePoint list.
public string _OptionValue { get; set; }
public class MyEditorPart : EditorPart { private DropDownList ddl_Options; protected override void CreateChildControls() { base.CreateChildControls(); } public override bool ApplyChanges() { EnsureChildControls(); MyWebPart webPart = WebPartToEdit as MyWebPart; if (webPart != null) webPart._OptionValue=ddl_Panels.SelectedValue.ToString(); return true; } public override void SyncChanges() { EnsureChildControls(); MyWebPart webPart = WebPartToEdit as MyWebPart; if (webPart != null) ddl_Options.SelectedValue = webPart._OptionValue .ToString(); } } This is the meat and potatoes, if you will, of what makes the custom EditorPart a reality. But there is some more tweaking to do in order for it all to work: 4. Locate the CreateChildControls()method you created in the code in the previous step. Replace what’s inside with the following: base.CreateChildControls(); ddl_Options = new DropDownList(); lbl_Options = new Label(); lbl_Options.Text = “<strong>Choose:</strong><br />:”; using (SPSite site = new SPSite(“http://” + Page.Request.Url.Host.ToString())) { using (SPWeb web = site.OpenWeb()) { SPList Forms = web.Lists["Side Panel Content"]; SPQuery qry = new SPQuery(); qry.Query = @”<Query><Where><Gt><FieldRef Name=’ID’ /><Value Type=’Counter’>0</Value></Gt></Where></Query>”; SPListItemCollection SPLIC = Forms.GetItems(qry); if (SPLIC != null && SPLIC.Count > 0) { foreach (SPListItem SPLI in SPLIC) { string OptionTitle = “”; string OptionID = “”; if (SPLI["ID"] != null) PanelID = SPLI["ID"].ToString(); if (SPLI["Title"] != null) PanelTitle = SPLI["Title"].ToString(); if (PanelTitle != “” && PanelID != “”) ddl_Options.Items.Add(new ListItem(OptionTitle, OptionID)); } } } } Controls.Add(lbl_Panels); Controls.Add(ddl_Panels);
lbl_MySelection.Text = WebPart._OptionValue; This will set the label in your Web part’s User Control to the value of the DropDown list in your custom EditorPart tool pane property
You liked the article?
Like : 0
Vote for difficulty
Current difficulty (Avg): Medium
1/3
TekSlate is the best online training provider in delivering world-class IT skills to individuals and corporates from all parts of the globe. We are proven experts in accumulating every need of an IT skills upgrade aspirant and have delivered excellent services. We aim to bring you all the essentials to learn and master new technologies in the market with our articles, blogs, and videos. Build your career success with us, enhancing most in-demand skills in the market.
Stay Updated
Get stories of change makers and innovators from the startup ecosystem in your inbox