In this post we will discuss how we can create a visual web part using Visual Studio 2013 in SharePoint 2013. Here we will try to create a visual web part by using the Visual web part template in the visual studio.
Open your visual studio 2013 and then go to File -> New Project. This will open the New Project dialog box. There from the left side installed templates, select “SharePoint Solutions” which is under Templates -> Visual C# -> Office/SharePoint. The from the right side choose the .Net Framework as 4.5 and also choose “SharePoint 2013 – Empty Project” template which looks like fig below:
– SharePoint templates missing in Visual studio 2010
– Create custom Action group using visual studio 2010 in SharePoint 2010
– Steps to create a new managed property SharePoint 2013 online
Then it will open the SharePoint Customization Wizard. Here it will ask for the Site URL to debug. After giving the URL you can validate the URL by clicking on the Validate button. Then choose “Deploy as farm solution” option. The screen should look like below:
This will create the Empty SharePoint project. Now Right Click on the Project and then click on Add -> New Item as shown in the fig below:
Then from the Add New Item dialog box, from the Offic/SharePoint templates, choose (Visual Web Part (Farm Solution Only)) as shown in the fig below:
Once it will add the Visual Web Part Project, you can Open the ascx file and write the code. Here I am simply adding a textbox control, a button control and a label control. My idea is on button click we want to display a message. So the code will look like below:
<asp:TextBox ID=”txtName” runat=”server”></asp:TextBox>
<asp:Button ID=”btnClickHere” runat=”server” Text=”Click Here” OnClick=”btnClickHere_Click” /><br />
<asp:Label ID=”lblMessage” runat=”server” Text=””></asp:Label>
Now you can right click and go to the code behind file. And write the below code in the button click.
protected void btnClickHere_Click(object sender, EventArgs e)
lblMessage.Text = “Hello: ” + txtName.Text.Trim();
The code behind code looks like below:
Now Build the solution and if no errors are there then you can right click on the Solution explorer and can click on Deploy the solution.
This will deploy the solution in the site.
When you Build the solution it will generate a wsp file which you can take and deploy in different servers (Like testing or Production where visual studio is not installed usually).
If you want to deploy using PowerShell you can read below articles:
– How to deploy farm wsp solution in sharepoint 2010 using PowerShell?
– How to deploy sandboxed solution in SharePoint 2010?
Depending on the mode you have selected the wsp will be available either in Debug folder or in Release folder like below:
Now you can open your SharePoint 2013 site and edit the page where you want to add your custom visual web part . When you click on Add web part, you will be able to see your custom web part under “Custom” web part categories like below:
When you will click on the button, you will be able to see the message in the label like below:
Hope this will be helpful to you.
Download FREE SharePoint 2019 Installation PDF Guide
This FREE PDF contains, Steps by step guide to install SharePoint 2019 Preview, prerequisites, hardware and software new features. First impression to SharePoint Server 2019 new modern site, modern lists and modern document libraries.