Objective
In this article we will see,
- How to create custom WebPart.
- How to use SPGridView on visual WebPart.
- How to use LINQ to SharePoint
- How to deploy the WebPart in SharePoint site.
Step 1
Open Visual studio 2010 and create new project. From SharePoint 2010
project template select Visual Web Part project.
Step 2
Provide the SharePoint site URL, where you want to debug and deploy
the Visual Web Part.
Before clicking on Finish, click on Validate button to validate
whether you are able to successfully connect SharePoint site or not.
Step 3
Create DataContext class or LINQ to SharePoint proxy class.
Open the command prompt and change directory to
C:\Program Files\Common Files\Microsoft Shared\Web Server
Extensions\14\BIN
Type command CD C:\Program Files\Common Files\Microsoft
Shared\Web Server Extensions\14\BIN
Now we need to create the context class for corresponding list
definitions.
C:\Program Files\Common Files\Microsoft Shared\Web Server
Extensions\14\BIN>spme
tal.exe /web:http://dhananjay-pc/my/personal/Test1
/namespace:nwind /code:Product.cs
In above command we are passing few parameters to spmetal.exe,
they are as below
a. /web:Url
Here we need to provide URL of SharePoint site
/web:http://dhananjay-pc/my/personal/Test1 /
://dhananjay-pc/my/personal/Test1 / is URL of
SharePoint site, I created for myself. You need to provide your
SharePoint site URL here.
b. /namespace:nwind
This would be the namespace under which class of the list will get
created. In my case name of the namespace would be nwind.
c. /code:Product.cs
This is the file name of the generated class. Since we are giving
name Product for the file then class generated will be ProductDataContext
Step 4
Add createdDataContextclass to the Project or LINQ to
SharePoint proxy class.
Now add this class to the project. To do this, right click on the
visual web part project and select Add existing item. Then browse to C:\Program
Files\Common Files\Microsoft Shared\Web Server Extensions\14\BIN and
select Product.cs
Add references to the Project
Microsoft.SharePoint
Microsoft.SharePoint.Linq
Right click on Reference and select Add Reference. To locate
Microsoft.SharePoint and Microsoft.SharePoint.Linqdll browse to C:\Program
Files\Common Files\Microsoft Shared\Web Server Extensions\14\ISAPI.
All the SharePoint dll are here in this location.
Step 5
Add SPGridView on the Web Part
Now open the Visual Web Part project and open
VisualWebPart1Usercontrol.ascx
Add the below markup to create one SPGridView
In markup in DataField we need to provide column name of SharePoint
list to bind the list items to SPGridView column
VisualWebPart1UserControl.ascx
01.
<%@
Assembly Name="$SharePoint.Project.AssemblyFullName$" %>
02.
<%@
Assembly Name="Microsoft.Web.CommandUI, Version=14.0.0.0,
Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
03.
<%@
Register Tagprefix="SharePoint"
Namespace="Microsoft.SharePoint.WebControls"
Assembly="Microsoft.SharePoint, Version=14.0.0.0, Culture=neutral,
PublicKeyToken=71e9bce111e9429c" %>
04.
<%@
Register Tagprefix="Utilities"
Namespace="Microsoft.SharePoint.Utilities"
Assembly="Microsoft.SharePoint, Version=14.0.0.0, Culture=neutral,
PublicKeyToken=71e9bce111e9429c" %>
05.
<%@
Register Tagprefix="asp" Namespace="System.Web.UI"
Assembly="System.Web.Extensions, Version=3.5.0.0, Culture=neutral,
PublicKeyToken=31bf3856ad364e35" %>
06.
<%@
Import Namespace="Microsoft.SharePoint" %>
07.
<%@
Register Tagprefix="WebPartPages"
Namespace="Microsoft.SharePoint.WebPartPages"
Assembly="Microsoft.SharePoint, Version=14.0.0.0, Culture=neutral,
PublicKeyToken=71e9bce111e9429c" %>
08.
<%@
Control Language="C#" AutoEventWireup="true"
CodeBehind="VisualWebPart1UserControl.ascx.cs"
Inherits="VisualWebPartProject1.VisualWebPart1.VisualWebPart1UserControl"
%>
09.
<%@ Import
Namespace="Microsoft.SharePoint.WebControls" %>
10.
<
SharePoint:SPGridView
ID
=
"sp1"
runat
=
"server"
AutoGenerateColumns
=
"false"
>
11.
<
HeaderStyle
HorizontalAlign
=
"Left"
ForeColor
=
"Blue"
Font-Bold
=
"true"
/>
12.
<
Columns
>
13.
<
SharePoint:SPBoundField
DataField
=
"ProductId"
HeaderText
=
"Product ID"
></
SharePoint:SPBoundField
>
14.
<
SharePoint:SPBoundField
DataField
=
"ProductName"
HeaderText
=
"Product Name"
></
SharePoint:SPBoundField
>
15.
<
SharePoint:SPBoundField
DataField
=
"ProductPrice"
HeaderText
=
"Product Price"
></
SharePoint:SPBoundField
>
16.
</
Columns
>
17.
</
SharePoint:SPGridView
>
Step 6
Now write code behind for SPGridView
Add the namespaces
Write the below code to fetch the List items from SharePoint list
using LINQ to SharePoint
VisualWebPart1UserControl.ascx.cs
01.
using
System;
02.
using
System.Web.UI;
03.
using
System.Web.UI.WebControls;
04.
using
System.Web.UI.WebControls.WebParts;
05.
using
Microsoft.SharePoint;
06.
using
Microsoft.SharePoint.Linq;
07.
using
nwind;
08.
using
System.Linq;
09.
10.
namespace
VisualWebPartProject1.VisualWebPart1
11.
{
12.
public
partial
class
VisualWebPart1UserControl
: UserControl
13.
{
14.
protected
void
Page_Load(
object
sender, EventArgs e)
15.
{
16.
ProductDataContext
context =
new
ProductDataContext(SPContext.Current.Web.Url);
17.
EntityList<test1_productitem>
products = context.GetList<test1_productitem>(
"Test1_Product"
);
18.
var result =
from r
in
products
select r;
19.
sp1.DataSource = result;
20.
sp1.DataBind();
21.
}
22.
}
23.
}</test1_productitem></test1_productitem>
In above code Test1_Product is name of the SharePoint list.
Step 7
Deploy the WebPart to SharePoint site. For that we need to right
click on the Visual Web Part project and click Deploy.
Step 8
Open the SharePoint site where you have deployed the visual web part
and select the Edit page option .
After that select Insert
After clicking Insert select WebPart to insert
From the custom category select visual web Part.
Note: Name of the project we created in first step.
Name I gave was VisualWebPart1 . In custom category you will find name
you gave of the project in step1.
After selecting the WebPart click on Add button. And
after clicking button on the home page you will get the custom WebPart
populated with Test_Product list items.
No comments:
Post a Comment
Note: only a member of this blog may post a comment.