Connecting Visual Web Parts programmatically
Visual web parts allow developers to easily design the user interface as they are doing in conventional ASP.Net applications. The main advantage of connected Web Parts is to exchange data between web parts at run time. Here we are going to use two visual web parts one is called Tags as provider web part and other one is called Items as consumer web part.
Tags web part retrieve all the items from tag list. Tags list have two columns which are tag and connection which is shown below
Items web part which is act as filtering web part to retrieve filtering items from Items List. Item List is shown below.
Now, When we click tag from item web part, particular connection for the selected tag should pass to the items web part and filtered from Item A and Item B. For this first I m going to create tags web part to get all tags and connection properties from Tags List. (Note - Bind all the tags in link button and pass connections as command argument of this link button in Grid View ). Tags Webpart is shown below
Interface
Now lets set the connection provider attribute to Tags web part. First define the Interface that will specify the data we wanted pass or exchange from one web part to another web part.
public interface ITagString
{
string TagString { get;
set; }
}
Now in the Tag web part class, you need to implement the TagString property which is a string as you defined in the Interface. Actually the webpart will load the user control to its control collection in the CreateChildControls.
1- Implement the ItagString Interface
2- Implement the get and set methods of the TagString property of ITagString Interface
3- ConnectionProvider property after the CreateChildControls subroutine. which will expose the interfacing data to the Consumer web part.
Here you can pass the connection string using Link button command events
Items web part - Consumer web part
In the Item web part , create an object for Interface “ITagString”. The purpose of this variable is to receive/consume data from the other web part. So you can create a web part variable in user control and a user control variable in the web part code and inside CreateChildControls method, assign the web part variable
1. User control variable to pass the value to ItemsUserControl class
2. Method will get the Interface ref and returns the value passed by provider web part
Now filter the Item list based on this parameter.
1- Reference from Items web part class
2- Label to print passed parameter
3- Filter the Items list based on parameter
Configure the web parts to enable connection (After deployed)
Following steps are shown how to enable the connection from tag web part and items web part.
When you are done, you will end up with 2 web parts on a web parts page that will communicate with each other as you make click on tags.
Enjoy!
