Creating Connectable Web Parts Overview In SharePoint, a web part can be 'connected' to another web part to provide some information at run-time.  The Provider web part pushes out the contracted information and the Consumer web part is set up to receive and consume the shared information. Components of Connectable web parts Interface: This custom interface will define the data to be shared from the Provider to the Consumer web part. Provider web part: Implements a data interface - this interface is a definition of the data that will be shared from the Provider web part to the Consumer web part. Provide a ConnectionProvider method which will expose the interfacing data to the Consumer web part. Consumer web part: ConnectionConsumer method which will receive the interfacing data Consume the interfacing data and provide enriching details to the user. Scenario:  This Post describes you  how to create two connectable Web Parts: a Web Part that provides a string and another Web Part that consumes and displays the value of that string.   Here is the following steps : 

1. Creating an interface to define the string that is being provided.
2. Creating a Web Part by using the Microsoft Visual Studio Web Part item template.
3. Creating a provider Web Part that defines a string.
4. Creating a consumer Web Part that uses and displays the string.
5. Creating a Web Parts page and connecting the provider and consumer Web Parts

Steps for creating connectable web parts Step1:  Create  ”BookList” List inside SharePoint  And Add New items    Create One More List called "BookDetails" And create Columns as like Below Dialog     Add New items as we required

Step2: To create an Empty SharePoint Project

1.  Start Visual Studio 2013 in administrator mode.
2. On the File menu, point to New, and then click Project. If Visual Studio is set to use Visual Basic development settings, on the File menu, click New Project.
3. In the New Project dialog box, select the Sharepoint Soluction  node.
4. In the Templates pane, select Empty SharePoint Project.
5. For the name of the project, type SampleConnectblewebparts, and then click OK.

 

  It will open the wizard to create the project Select the site where you want to deploy the webpart.  http://najbsys:54321". Click on Validate Option to validate the site details. It will show the pop-up saying that connection successful. Close the Pop-up, and select Deploy as a Farm box solution and click on Finish to create the project for this webpart  

Step3: create an interface

This programming task defines the process of creating a class that implements all of   the necessary methods and events for a connection interface. In Solution Explorer, click the SampleConnectblewebparts project. On     the Project menu, click Add New Item. In the Installed Templates pane, click Code. Click Interface. Type ConnectbleInterFace for the name of the interface, and then click Add. Replace the interface with the following code to define the string member of this interface.  

    Step 4: create a provider Web Part

On the Project menu, click Add New Item, Select The Visual Web part In the ProviderVisualWebpar.cs add the following code to indicate that the ProviderVisualWebpar class implements the ConnectbleInterFace   interface. Code for Providerwebpart.ascx page Code for Providerwebpart.ascx.cs page

Step5: create a Consumer Web Part

On the Project menu, click Add New Item, Select The Visual Web part Code for CosumerVisualWebPart.ascx page For Display the information in a Gridview Code for CosumerVisualWebPart.ascx.cs page  Build and Deploy the solution.

Step6:     To connect the provider and consumer Web Parts

Click Site Actions, and then click More Options. In the Create page, click Web Part Page, and then click Create. In the New Web Part Page page, type ConnectableWebParts as the name,     and then click Create.   Add Provider  web part on the web part page. And Below Add Consumer  webpart  on the webpart page. Click the Consumer  webpart  Web Part, and then click the drop-down arrow in the upper-right section of the Web Part. .Click On Edit WebPart   Click On Connections Provider webpart and connect it to the consumer.   Now the 2 webparts have been connected to each other using the interface. In the ribbon, on the Page tab, click Save. Now Test The Functionality. Click On Dropdown Button ,We will Get Particular Item Information If we will Change the dropdown Button We  will get That Particular item Details