My Blogs

Creating a Web Part with Client-side Scripts

Anweshi — Tue, 29 Mar 2011 17:51:15 GMT

Check out my latest blog post on SharepointDev site on “Creating a webpart with Client Side Scirpts)

http://blogs.msdn.com/b/sharepointdev/archive/2011/02/15/creating-a-web-part-with-client-side-script.aspx

“Calling a WCF Service using jQuery in SharePoint” on SharepointDev Blog site

Anweshi — Tue, 29 Mar 2011 17:48:33 GMT

Check out my article about“Calling a WCF Service using JQuery in Sharepoint” SharepointDev blog site. I have initially blogged in on my blogpost, now its up on SharepointDev Site. Link to my blog http://blogs.msdn.com/b/anweshi/archive/2010/11/30/calling-wcf-service-using-jquery-in-sharepoint-applications.aspx

Link to my blog on SharepointDev http://blogs.msdn.com/b/sharepointdev/archive/2011/02/22/calling-a-wcf-service-using-jquery-in-sharepoint.aspx

RAD using InfoPath and BCS, and Overcoming performance limitations using SPs and Filters

Anweshi — Thu, 24 Feb 2011 20:32:19 GMT

Contributors : Anweshi Deverasetty, Ashutosh Mahamia

Background

In our current Sharepoint project, we had a requirement to create a user interface for performing CRUD operations on Master detailed tables. We had to generate forms for Create/Edit/Delete/View operations on Master and Detailed tables. We came up with an approach to generate all these forms OOB with less C# code. So we started with BCS ( Business Connectivity Services).

Introduction.
1. The Challenge
2. The Solution.
BCS Entities: The Business cum Data Access Layer
1. Create CRUD operations on Entities using Stored Procedures.
2. Creating Associations.
3. Performance Check on BDC Model
4. Importing BDC Model
5. Creating The External Lists.
SharePoint InfoPath: For Application Presentation Layer
1. Generating InfoPath for External Lists.
2. Enabling Search/Filters on External Content Types.
The Application: A SharePoint site / Site collection
1. Creating a Site for Application.
2. Creating An Application Page

Introduction

There is growing demand and expectation as well in the field to be able to leverage the new features in SharePoint 2010 to create database driven simple SharePoint solutions which do not involve lot of customization, business rules and validations. This article will help you to understand how BCS and InfoPath, together can supplement this requirement and facilitate database CRUD operations based simple applications with decent User Interface.

The Challenge

One of the key challenges in this approach is Performance. If the number of records maintained by the application outgrow to what the entities can handle, then it reflects upon a poor user experience. The pages rendering slow, the data searches taking significant time, and other related issues would need an adequate mitigation. So to encounter this challenge, we start with exploring BCS capabilities, then onto SharePoint InfoPath and lastly turning to the programmable objects in the database.

The Solution

First, we take a decision to generate BCS Entities which will use Stored Procedures (SP). As an alert designer or developer one can easily visualize the high level benefits of using the SP to support the BCS (which in turn is our Data Access Layer for the application in question). With this we have the flexibility of using parameters, governing the resultant data expected, applying set of business rules within the SPs, and the tuning of queries can give enormous performance boost. Secondly, designing and developing rich InfoPath based UI forms, completely out-of-the-box. We harvest a rich UI, New/Edit/View/List forms, with absolutely zero lines of code. Besides the regular CRUD operation support, we will also learn how to create Associations, Filters, and generating these InfoPath forms in the document forward.

BCS Entities: The Business cum Data Access Layer

Let’s go step by step and see how we can create this as an end to end solution. Here is a snapshot of the Database Diagram that we are going to use in our solution. We are going to use Department, Employee and Job tables.

Create CRUD operations on Entities using Stored Procedures

Create the following Stored procedures on Department table for all the CRUD operations.

Stored Procedure Name	Parameters	Return parameters
InsertDepartment	@Deptname @Location @User	Deptno
UpdateDepartment	@Deptno @Deptname @Location @User
DeleteDepartment	@Deptno
GetDepartment	@Deptno	Deptno Deptname Location User
GetAlDepartments		Deptno Deptname Location User
InsertEmployee	@Empname @Jobno @Deptno @User	Empno
UpdateEmployee	@Empno @Empname @Jobno @Deptno @User
DeleteEmployee	@Empno
GetEmployee	@Empno	Empno Empname Jobno Deptno User
GetAllEmployees		Empno Empname Jobno Deptno User

Create Entity for Department table

Create an Entity for Department on which we are going to create all the CRUD operations. Also specify the Primary Key/Identity Column as given in the below snippet.

. . . . .

Generate CRUD operations on Department using Stored Procedures

You might have often used SharePoint Designer to easily generate CRUD operations on a table. But when it comes to using Stored Procedures, it’s not often easy. SharePoint Designer might not help in this case. We will have to create operations manually. Let us see how to generate CRUD operations using Stored Procedures. Create an element Methods in the Entity Element and start adding all the operations. Let’s start creating the following operations on the Department Entity. 1. Create 2. Update 3. Read Item 4. Read List If you are using SharePoint Designer to generate operations on a Table then the BackEndObjectType is set to Table automatically. But our plan is to generate CRUD operations using Stored Procedure. The following table shows you what needs to be set for a Table and Stored Procedure

Property Name	For Stored Procedure	For Table
BackEndObject	Name of the Stored Procedure	Name of the Table
BackEndObjectType	SqlServerRoutine	SqlServerTable
RdbCommandText	Name of the Stored Procedure	Insert the SQL Statement.
RdbCommandType	StoredProcedure	Text
Schema	Name of the Schema	Name of the Schema

For example , See the below XML snippet for a stored procedure. For every operation the following properties need to be set if you are calling a stored procedure.

[StoredProcedureName]

SqlServerRoutine

NameoftheStoredProcedure

StoredProcedure

[SchemaName]

Before generating all the operations, you need to note few things 1. All CRUD operations should return and pass same set of parameters , else New/Edit/View will not get generated. This indicates, the set of parameters that you return from ReadItem and ReadList should be the same and also the parameters that you pass to Create and Update should also be the same. In case you have a parameter in ReadItem and you do not return it in ReadList and do not pass that parameter in Create or Delete then the forms do not get generated. 2. Parameters are case sensitive. Make sure the parameter names are same and they are case sensitive. Forms will not get generated if the names are different or case sensitive. You might receive the following error if the parameters are case sensitive Could not save changes. No Finders available in the View Group associated with the SpecificFinder (Read Item) operation ‘ReadItem’ on Entity (External Content Type) with Namespace = ‘XXXXX’, Name =’XXXX’. The list cannot be created 3. SPs should be created before creating the External lists. Though you created CRUD operations on Entities, if you do not have corresponding Stores procedures, then the forms do not get generated.

Create Item Operation

Write the Create method with all the input parameters required to be passed to InsertDepartment Stored Procedure.

InsertDepartment

SqlServerRoutine

InsertDepartment

StoredProcedure

dbo

Update Item Operation

Write the Update method by passing the Department Id with all the input parameters the need to be modified into the UpdateDepartment Stored Procedure.

UdpateDepartment

SqlServerRoutine

UdpateDepartment

StoredProcedure

dbo

Delete Item Operation

Write the Delete method by passing the DepartmentId that you want to delete into the DeleteDepartment Stored Procedure.

DeleteDepartment

SqlServerRoutine

DeleteDepartment

StoredProcedure

dbo

Read Item Operation

Write a Read Item method which returns the Department values for the specified Department Id using the GetDepartment Stored Procedure

GetDepartment

SqlServerRoutine

GetDepartment

StoredProcedure

dbo

None

Read List Operation

Write the Read List method which would return all the Departments by calling GetAllDepartments Stored Procedure.

GetAllDepartments

SqlServerRoutine

GetAllDepartments

StoredProcedure

dbo

Create Entity for Employee table

Now, create an Entity for Employee table with all the CRUD Operations. Here is the XML snippet for the Employee entity with all the CRUD Operations

InsertEmployee

SqlServerRoutine

InsertEmployee

StoredProcedure

dbo

UdpateEmployee

SqlServerRoutine

UdpateEmployee

StoredProcedure

dbo

DeleteEmployee

SqlServerRoutine

DeleteEmployee

StoredProcedure

dbo

GetAllEmployees

SqlServerRoutine

GetAllEmployees

StoredProcedure

dbo

[dbo].[GetEmployee]

SqlServerRoutine

[dbo].[GetEmployee]

StoredProcedure

dbo

None

Creating Associations

Let us create an association on Employee table. When you generate the New/Edit forms on the Employee Entity you will see that the Deptno just displays a textbox. And the user needs to enter the Dept ID as shown in the figure below ( we are going to generate the forms later in this section) . In the above screen, it would have been good if there was an option to select the Departments available. To achieve this your need to create Association. Let us see, how the edit form would look like. Btw, later we are going to generate Infopath forms. Let us see how to create an Association. Association has to be created on the master table ie., Department Entity. Step 1: Create a Stored Procedure which would return the Employee details specific to a Department. Make sure it returns same set of parameters as the other CRUD operations return/Pass, else as specified earlier, the forms might not get generated.

Stored Procedure Name

Parameters

Return parameters

DepartmentEmployeeAssociation

@Deptno

Empno

Empname

JobNo

DeptNo

User

Step 2: Create Association on the Employee Entity. Create an association method by calling the above defined Stored Procedure.

DepartmentEmployeeAssociation

SqlServerRoutine

DepartmentEmployeeAssociation

StoredProcedure

dbo

Step 3: Create Association Group on Employee. Create the AssociationGroup elemen under Entity element.

Step 4: Apply the association to the Deptno parameter in the Employee entity in all the operations. Make sure this association is applied to all the methods, else you might have issue with the generation of the forms. You can see that, the similar association is done for Deptno parameter while defining association as well in the above XML association snippet. Here is a sample of Create Operation on Employee Entity where we are applying association on Deptno column. This should be done for all the operations ie., Create/Udpate/ReadItem/ReadList, in other words where ever Deptno is being referred.

Now, the association is ready. Try to add / edit an item on the Employee External List and see that the Picker control is available. Here is the screenshot. On the click on Show Picker control , you will be able to see the list of Departments from where you can make selection. You can create a similar association on Jobno as well. You need to create an Entity for Job with ReadItem and ReadList operations and create an association on Department. Associations can be used to create connections on BDC Webparts and also to display the Picker controls.

Performance Check on BDC Model

Ensure that your BDC Model has undergone the following changes 1) All operations are Stored Procedure based 2) All read list operations must have parameters 3) Stored procedures are internally configured to return a max number of records 4) Or, All read list operation must have filters set on maximum rows to return 5) If you don’t have the filter ON on read-list, then during BDC Model import warnings will be generated. 2.3 Importing BDC Model Now, it is time to import the BDC Model. Open Central Admin, add select from “Manage Service Applications” under ”Application Management” . Select “Business Data Connectivity Services” that you configured .Click on Import and Import the BDC Model that you created just now. Ensure that · You have Secure Store Service turn on · you have set the database name correctly in the “External System” for your imported model · The model is using SSO

Creating The External Lists

After importing the BDC Model, let us create External Lists for Department and Employee entities. To create an External List, from Site Actions select View All Site Content and select Create “Custom List”. Select “External List”. Select the External Content Type as “Department”. Here is the screenshot of how the Department External List would look like. Similarly, create “Employee” External List. Here is the screenshot of Employee External List.

SharePoint InfoPath: For Application Presentation Layer

Observe that in all the operations ie., New/Edit and View forms are automatically generated. Here is the screen shot of how the forms would look like for an Employee External List. New Item Edit Item View Item

Generating InfoPath for External Lists

You can observe that all the forms generated look like the normal out of box forms of a custom list. But it is difficult to customize these forms. InfoPath is one of the solutions to customize. Here we will see how InfoPath forms can be generated. Open SharePoint Designer and open the Department External list that you’ve created. You can see that all the 3 forms are listed in the External list under Forms. To generate InfoPath forms for all these 3 operations, from “List Settings” ribbon menu under “Design forms in InfoPath Designer” select “Item”. This option generates all the 3 InfoPath forms and then opens up the InfoPath designer. You can observe that 3 extra infopath forms displayifs.aspx, editifs.aspx and newifs.aspx would be created and they would be marked as default forms. Here you can customize the whole form. Here is the screen shot of the InfoPath designer.

Enabling Search/Filters on External Content Types

Let us try to search in the Show Picker Dialog box. When you perform a search, this is what you see This is because filters are not enabled on the External Content Type Read List method. Let us know what needs to be changed for this. Step 1: Change the stored procedure GetAllEmployees to accept Deptname as a parameter and write the query accordingly. Step 2: Update the ReadList with the Filter Descriptor as shown below

GetAllDepartments

SqlServerRoutine

GetAllDepartments

StoredProcedure

dbo

false

None

Now, when you search items in Show Picker dialog, you will be able to get correct results.

The Application: A SharePoint site / Site collection

Creating a Site for Application

Let’s say you are planning to create a site, “My First BCS Site” for your application. Follow the standard site provisioning steps in Central Admin to create your site. (site collection from SharePoint perspective). Apply applicable security settings to your site. Once this is done, create a content page to place the external Lists and connect them to show limited amount of data at a time.

Creating An Application Page

Create a “New Page” (select from “Site Actions”) with name “Employee Master” and add the 2 external list. To add the external list in to the page, from “Insert “ ribbon menu select External List and select Department and Employee External Lists. By default, when you add the external list, this is how the page would look like. It would by default display BDC Identity columns Edit both the web parts and select view as “Department Read List” and “Employee Read List”. This is how the screen would look like once the views are applied.

We will include in the blogpost to connect these 2 External lists.

Working with Sharepoint 2010 Themes

Anweshi — Thu, 03 Feb 2011 07:56:47 GMT

Check out my blog post about Sharepoint 2010 Themes on Sharepoint Developer Team Blog at http://blogs.msdn.com/b/sharepointdev/archive/2011/02/03/working-with-sharepoint-2010-themes.aspx

Sharepoint 2010 BCS Object Model Code Snippets

Anweshi — Mon, 24 Jan 2011 21:22:26 GMT

Last year, during the release of Sharepoint 2010 , I have submitted few code samples on BCS to Sharepoint SDK. Here is the link where my code snippets are available. http://msdn.microsoft.com/en-us/library/ee557359(v=office.14).aspx Let me point you to few other URLs which I have created that will help you executing methods on External Content Type, here they are Code Snippet: Execute the Creator Method Instance of an External Content Type http://msdn.microsoft.com/en-us/library/ff464454.aspx Code Snippet: Execute an Updater Method Instance of an External Content Type http://msdn.microsoft.com/en-us/library/ff464403.aspx Code Snippet: Execute the Deleter Method Instance of an External Content Type http://msdn.microsoft.com/en-us/library/ff464351.aspx Code Snippet: Execute a Finder Method Instance of an External Content Type http://msdn.microsoft.com/en-us/library/ff464415.aspx Code Snippet: Execute the AssociationNavigator Method Instance of an External Content Type http://msdn.microsoft.com/en-us/library/ff464362.aspx Code Snippet: Execute the Associator and Disassociator Method Instances of an External Content Type http://msdn.microsoft.com/en-us/library/ff464336.aspx Code Snippet: Execute the BulkAssociationNavigator Method Instance of an External Content Type http://msdn.microsoft.com/en-us/library/ff464328.aspx Have a look at the BDC Model XML Snippets and the operations on it

Sample BDC Model XML Snippets: Modeling Stereotyped Operations http://msdn.microsoft.com/en-us/library/ee559335.aspx

Calling WCF Service using JQuery in Sharepoint Applications

Anweshi — Tue, 30 Nov 2010 03:08:00 GMT

Introduction

This article explains about how a WCF Service can be called using JQuery in a Sharepoint Application.

Creating a WCF Service

Deploying WCF Service in Sharepoint environment

Testing WCF Service

Accessing WCF Service using JQuery from a Sharepoint page

Contents of JS File

Creating a WCF Service

Let us start with the creation of Data Access Layer. Create a class library with name “DatabaseManager” with a class “ProductsManager”. The ProductsManager class has a function “GetProducts” which gets the list of all Products from the database as given below.

///

/// Gets all the Products from the Database
///

/// Returns List of Products
public List GetProducts()
{
List productsList = new List();

Database DatabaseInstance = DatabaseFactory.CreateDatabase(ConnectionStringkey);
DbCommand DatabaseCommand;

using (DatabaseCommand = DatabaseInstance.GetStoredProcCommand(SP_GetProducts))
{
    using (IDataReader reader = DatabaseInstance.ExecuteReader(DatabaseCommand))
    {
               while (reader.Read())
               {
                    Products products = new Products();
                    products.ProductName = reader["ProductName"].ToString();
                    products.ProductDesc = reader["ProductDesc"].ToString();
                    products.Price = reader["Price"].ToString();
                    products.Quantity = reader["Quantity"].ToString();
                    productsList.Add(products);
                }
            }
          return productsList;
       }
   }

Add a strong name to this assembly.

Now, create a WCF Service with name “SampleWCFService” and add a reference to “DatabaseManager”. As we are going to deploy this Service in sharepoint 2010 application, change the target .Netframework to 3.5. Now rename the IService1 file to IProductsService and Service1 to ProductsService. Make sure it’s updated in all the places. Add a strong name to this assembly.

Follow the below steps to implement WCF Service

1. Add a reference to Microsoft.SharePoint.Client.ServerRuntime.dll and open ProductsService.cs using “View Map” option to add the Factory Attribute as given below. This will reduce the Web.config entries for configuring the WCF Service.

<%@ ServiceHost Language="C#" Debug="true" Service="SampleWCFService.ProductService" CodeBehind="ProductService.svc.cs" Factory="Microsoft.SharePoint.Client.Services.MultipleBaseAddressWebServiceHostFactory, Microsoft.SharePoint.Client.ServerRuntime, Version=14.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c"%>

2. Add the following highlighted attribute with a new method GetProducts in ProductsService.cs file

[BasicHttpBindingServiceMetadataExchangeEndpoint]
[AspNetCompatibilityRequirements(RequirementsMode = AspNetCompatibilityRequirementsMode.Allowed)]
public class ProductService : IProductService
{ ///

/// Gets the list of Products
///

       /// Returns the List of Products
       public List GetProducts()
       {
           ProductsManager productsManager = new ProductsManager();
           return productsManager.GetProducts();
       } }

3. Add a new Contract GetProducts in IProductService.cs [OperationContract]
[WebGet(UriTemplate = "/GetProducts", BodyStyle = WebMessageBodyStyle.Bare, ResponseFormat = WebMessageFormat.Json)]
List GetProducts();

Deploying WCF Service in Sharepoint environment

Follow the blow steps to deploy the WCF Service

1. Deploy DatabaseManager and SampleWCFService dlls into GAC

2. Copy the SampleWCFService dll into the Virtual directory bin folder

3. Copy the ProductService.svc into Layouts folder.

Testing WCF Service

In order to check whether the Service is up, navigate to ProductService.SVC file ie., http://siteurl/_layouts/ProductService.svc from browser. You will see a message “No End Point” on the screen. Now let’s try to access the method GetProducts ie., http://siteurl/_layouts/ProductService.svc/GetProducts from the browser again. It pops up the resultant file. Following is what you see set in the file.

[{"Price":"100","ProductDesc":"This is product1","ProductName":"Product1","Quantity":"10"}, {"Price":"200","ProductDesc":"This is product2","ProductName":"Product2","Quantity":"5"}, {"Price":"250","ProductDesc":"This is product3","ProductName":"Product3","Quantity":"6"}]

Accessing WCF Service using JQuery from a Sharepoint site

Now, its time to access this WCF Service using JQuery.

Create a JS file with name “CallWCFService.Js” and use the following snippets to call the service.

1. Create a function object Product to hold each Product details.

//Function object for Product

function Product(ProductName,ProductDesc,Price,Quantity)

{

this.ProductName=ProductName;

this.ProductDesc=ProductDesc;

this.Price=Price;

this.Quantity=Quantity;

}

2. Call the WCF Service using an AJAX Call

function CallWCFService(WCFServiceURL) {

$.ajax({

type: "GET",

url: WCFServiceURL,

contentType: "application/json; charset=utf-8",

dataType: '{}',

processdata: true,

success: function (msg) {

WCFServiceSucceeded(msg);

error: WCFServiceFailed

});

2. On successful call use the below code to populate the result set in to Products Array object

//On Successful WCF Service call

function WCFServiceSucceeded(result) {

var productsArray = new Array();

//Gets the Products

$.each(result, function (i, Product) {

productsArray[i]=Product;

});

//Print all the product details

$.each(productsArray,function(i,Product)

{

alert(Product.ProductName + ' ' + Product.ProductDesc + ' ' + Product.Price + ' ' + Product.Quantity)

});

}

Now, include this JS file into your sharepoint page as given below. Make sure you have included the JQuery.binray file.

This is the way how a WCF Service can be called using JQuery from any Sharepoint page.

Contents of JS File

Please find the enclosed JS file for your reference.

CallWCFService.zip