Sunday, July 7, 2013

Creating Custom Web part properties in SharePoint 2010

Displaying custom properties in the property Pane:
After you've imported your sample Web Part into a Web Part Page, you can display the property pane to view or change their values. A custom property will be displayed automatically in the default property pane if the property is of type string, bool, int or enum. The following table describes how each of these property types is displayed in the property pane.

Property Type
Displayed in property pane as
bool
Check box
DateTime
Text box
enum
Dropdown
int
Text box
string
Text box


See below steps How to create Custom Web Part Properties:
1- Start Visual Studio 2010
2- Create New Project
3- Select SharePoint -> Empty SharePoint Project
4- After that Right Click on Project at Solution Explorer
5- Add New Item -> Select Visual Web Part


String

Add below code in your Web Part 


[ToolboxItem(false)]
[XmlRoot(Namespace = "wp_testWP")]
public class wp_testWP : System.Web.UI.WebControls.WebParts.WebPart
  {
// Visual Studio might automatically update this path when you change the Visual Web Part project item.

private const string _ascxPath = @"~/_CONTROLTEMPLATES/wp_testWP/wp_testWP/wp_testWPUserControl.ascx";
private string _name;


[System.Web.UI.WebControls.WebParts.WebBrowsable(true),
System.Web.UI.WebControls.WebParts.WebDisplayName("Enter Name: "),
System.Web.UI.WebControls.WebParts.WebDescription(""),
System.Web.UI.WebControls.WebParts.Personalizable(System.Web.UI.WebControls.WebParts.PersonalizationScope.Shared),
System.ComponentModel.Category("Mohit Custom WebPart Properties"),
System.ComponentModel.DefaultValue("")]
public string Name 
 {
    get { return _name; }
    set { _name = value; }
 }

protected override void CreateChildControls()
{
       Control control = Page.LoadControl(_ascxPath);
       Controls.Add(control);
  }

 }
}



Enum/DropdownList:
To Add DropdownList control add below code


public enum myColor
        {
            Green,
            Red,
            Blue,
            Yellow
        };

private myColor _col;

[WebBrowsable(true),
Category("Mohit Custom Webpart Properties"),
Personalizable(PersonalizationScope.Shared),
WebDisplayName("Select color: "),
WebDescription("Dropdown example")]     
public myColor ColMenu
{
 get { return _col; }
 set { _col = value; }

}



CheckBox:
To Add checkbox add below code


private bool _check;

[WebBrowsable(true),
Category("Mohit Custom Webpart Properties"),
Personalizable(PersonalizationScope.Shared),
WebDisplayName("Checkbox example : "),
WebDescription("Checkbox example")]     
public bool MyCheckBox
{
 get { return _check; }
 set { _check = value; }
}


















DateTime:
Add below code for DateTime textbox


private DateTime _dateTime;

[WebBrowsable(true),
Category("Mohit Custom Webpart Properties"),
Personalizable(PersonalizationScope.Shared),
WebDisplayName("DateTime TextBox:"),
WebDescription("DateTime example")]
public DateTime MyDateTime
{
 get { return _dateTime; }
 set { _dateTime = value; }

}




















Integer:
Add below code for integer Textbox


private int val;

[WebBrowsable(true),
Category("Mohit Custom Webpart Properties"),
Personalizable(PersonalizationScope.Shared),
WebDisplayName("Enter integer value : "),
WebDescription("Integer example")]
public int IntValue
{
 get { return val; }
 set { val = value; }

}



















Have Fun !

No comments:

Post a Comment

SharePoint Deployment Error : The specified path, file name, or both are too long.

Hi, Sometimes we get surprised with below error while deploying wsp file... Solution : To overcome with this issue, we just ne...