Create and deploy user control in sharepoint using feature Introduction


In this article I will describe that How to create and deploy user control in sharepoint using feature.
Create User Control Brief: 
We will create a very simple ASP.NET user control (.ascx) which will just display “Hello World”. To load this control in sharepoint we will create a generic webpart which can load any user control in sharepoint.

Deploy User Control Brief:
In this article I will not explain that how to deploy solution using feature. For this you can refer my previous article which explain about “Create and deploy webpart using feature”.
Here I will explain that where we should keep user control in solution structure as well as how it should be available to sharepoint when we activate feature.

Technical Details

User Control .ascx file code:-

<%@ control language="C#" autoeventwireup="true" inherits="Home.Project.UI.UserControls.HelloWorld, Home.Project.Solution" %>
<table>
<tbody>
<tr>
<td>Hello World.   
<asp:Label ID="lblTest" Text="" runat="server" /></td>
</tr>
</tbody>
</table>
Below point is important to write line number 1 in above code:-
namespace = “Home.Project.UI.UserControls.HelloWorld”
dll name = “Home.Project.Solution”
User Control .ascx.cs file code:-


using System;
using System.Web;
 
namespace Home.Project.UI.UserControls
{
    public partial class HelloWorld : System.Web.UI.UserControl
    {
        protected void Page_Load(object sender, EventArgs e)
        {
        }
    }
}







Generic WebPart to load user control:-








 
using System;
using System.Web.UI;
using System.Web.UI.WebControls.WebParts;
 
namespace MyProjects.UI.WebParts
{
    public class GenericUserControlPicker : System.Web.UI.WebControls.WebParts.WebPart
    {
        #region Variables
 
        const string ConfigMessage = "Please provide user control path";
        const string ErrorMessage = "There is some error. Please contact Administrator.";
        private UserControl userControl;
        private string userControlPath = string.Empty;
 
        [WebBrowsable(), Personalizable(),
        WebDisplayName("User control path"),
        WebDescription("Relative path to the user control 
                       (Ex:~/_controltemplates/usercontrols/HelloWorld.ascx)")]
        public string UserControlPath
        {
            get
            {
                return userControlPath;
            }
            set
            {
                userControlPath = value;
            }
        }
 
        #endregion
 
        #region CreateChildControls
 
        ///<summary> 
        /// Create all your controls here for rendering.
        /// </summary>
        protected override void CreateChildControls()
        {
            try
 
            {
                base.CreateChildControls();
                this.Controls.Clear();
                if (String.IsNullOrEmpty(UserControlPath))
                {
                    HandleException(ConfigMessage);
                }
                else
                {
                    userControl = (UserControl)LoadControl(UserControlPath);
                    this.Controls.Add(userControl);
                }
            }
            catch
            {
                HandleException(ErrorMessage);
            }
        }
        #endregion
 
        #region Load user control
        ///User control path
        public object LoadControl(string controlPath)
        {
            this.Page.Title = this.Title;
            return  this.Page.LoadControl(controlPath);
        }
        #endregion
 
        #region Handle Exception
        ///<summary>
        /// add error message in web part
       /// </summary>
        public void HandleException(string Message)
        {
            this.Controls.Clear();
            this.Controls.Add(new LiteralControl(Message));
        }
        #endregion
 
    }
}







Solution Structure:-

This project should be WSP builder project, so that it will automatically add entry in webconfig like safe control entry etc…

The important point is; you should place user control under 12 or 14 
hive  “/Templates/ControlTemplates/”. In this example i have created my custom folder under controltemplates. So the actual path of user control will be (considering sharepoint 2010):

C:\Program Files\Common Files\microsoft shared\Web Server Extensions\14\TEMPLATE\CONTROLTEMPLATES\UserControls\HelloWorld.ascx

To place your user control in above path using wsp deployment you have to keep only .ascx (not .ascx.cs) file in below structure.

solution_usercontrol

Steps to make work user control:-

1. Deploy WSP and activate feature on site…

2. Then add “GenericUserControlPicker” webpart.

3. Edit Page and modify web part property.

4. Add user control path in miscellaneous category : “~/_controltemplates/usercontrols/HelloWorld.ascx”

5. Apply and click ok.

6. Page will display Hello world.

















































Comments








Post a Comment