Passing Values between user controls using Events and Delegates

Sbanerjee
Posted by in .NET Framework category on for Advance level | Views : 67344 red flag

Simplest solution to pass values from one user control to another user control on a web page
Introduction
Always there comes a requirement where we developers need to pass values to between different user controls which are parts of a webpage or even sometimes there comes a requirement where we need to pass values from user control to the container page.
The job is easy when we have to pass values which are there on the user controls by exposing the value fields as properties of the user control. However it is challenging when on certain event the values should get passed.




Solution

The simplest solution to this situation I found is to handle this by use of events and delegates. Let me explain the solution with one simple example.
For example on a content page I am having two user controls e.g. UC1 and UC2. Contents of UC1 are:
1. List box having list of States
2. List box having list of Cities in the State (Pre-condition: User selects State from ListBoxStates and respective cities in the selected state gets populated in the ListBoxCities)
3. Button control, which will be used for confirming the user’s selections. Let us name it as btnSelect.
Contents of UC2 are:
1. List of selected cities from UC1. Let us name it as ListBoxSelectedCities.
Our requirement is whenever user selects (multiple) cities from ListBoxCities and clicks on btnSelect in UC1 then the selected cities should get populated in ListBoxSelectedCities in UC2.

In UC1, we need to declare the following objects:

public delegate void PassSelectedValues(string[] selectedCities);

public event PassSelectedValues citiesSelected;

Now in UC1 from the button click event we can raise citiesSelected event, delegate of which will carry the required values which we need to pass in between UC1 and UC2. In button click event we have to create the list of selected cities from ListBoxCities and we have to raise the citiesSelected event like this:

citiesSelected(selectedCities);

Here selectedCities is an array of strings which we have to create by looping through the ListBoxCities.

We have to declare a public property in UC2 which can be used to set the ListBoxSelectedCities. For example in UC2:

public string[] SelectedCitiesList

{

set

{

ListBoxSelectedCities.DataSource = value;

ListBoxSelectedCities.DataBind();

}

}

In the content page we have to declare the event handler for the event (citiesSelected) which we have raised from UC1. Thus in content page on page load we have to declare the handler of this event like this:

UC1.citiesSelected += new citiesUserControl.PassSelectedValues(passValuesHandlerMethod);

This handler method in the content page should have the same signature as of the delegate’s signature defined in UC1.

protected void passValuesHandlerMethod(string[] selectedCities)

{

 

}

Now from this method we can pass the value coming from UC1 to UC2 like this:

protected void passValuesHandlerMethod(string[] selectedCities)

{

   UC2.SelectedCitiesList = selectedCities;

}

In this way whichever values we are selecting in UC1 will get passed to UC2.

Conclusion

In this article we have seen that how to pass values between different user controls on a webpage using events and delegates. Same concept can be applied for passing value from user control to the content page.

 

Hope this will help everyone in handling their cases.

Regards,

Soumen

www.ethicaldeveloper.blogspot.com

 

Page copy protected against web site content infringement by Copyscape

About the Author

Sbanerjee
Full Name: Soumen Banerjee
Member Level: Starter
Member Status: Member
Member Since: 6/9/2008 6:54:20 AM
Country: India

http://www.ethicaldeveloper.blogspot.com/
Learning has no end, keep spreading knowledge as it increases self knowledge. Cheers

Login to vote for this post.

Comments or Responses

Posted by: Petejordan on: 1/13/2012 | Points: 25
it's not working.
can you provide proj ?
need reference for "citiesUserControl" especially.
Posted by: Sbanerjee on: 3/12/2012 | Points: 25
Hi Pete,

Could you let me know some more details like where exactly you are facing the issue.

Regards,
Soumen
Posted by: Puljenny on: 5/30/2012 | Points: 25
Hi Soumen,

I am trying to implement your solution but I am unable to do it. I am trying to modify it to fit in my needs. Actually what I am doing is:
I have two tabs in which each tab has a combobox...I need something like If i select an item in combobox1 then the combobox in other tab should also be changed to select the same value.
One thing to note here is that I am navigating to different usercontrols on tab selection change.
Could you Please help with this scenario...I have an example project created, if you want I can send that to you.
Thanks In Advance!
Posted by: Sbanerjee on: 5/30/2012 | Points: 25
Hi Puljenny,

If I understand correctly then both the controls are there in separate tabs and only 1 tab is visible at a time. When you are navigating to other tab then page postback will happen so I think simple solution could be using Session to store the value selected in combobox1 on selectedIndexChanged event and on load of other tab you can fill combobox2 from the value which is present in Session and then remove that value from Session.
If your requirement is different and you have to use event and delegate then let me know I will try to find the solution. I am suggesting Session as your other control is in other tab and you will display when you change tabs so easy solution is Session.


Regards,
Soumen
Posted by: Puljenny on: 5/30/2012 | Points: 25
Thank You Soumen, I will try doing what you said. Actually what you said is right. I don't have to use events and delegate to do this task. It is just that I saw your solution and tried it.
I have an other question, whenever something changes in combo1, the value should be changed in combo2 and vice versa. i.e, whenever i change combo2, the value should change in combo1. Will that happen using sessions?
Posted by: Sbanerjee on: 5/31/2012 | Points: 25
Hi Puljenny,

Yes that is possible. For that you have to write your own logic. On selectedIndexChanged of both the comboboxes assign the selectedValue in some Session variable and on tab change check that value from Session and assign that value to the other combobox.
Hope this will help you.


Regards,
Soumen
Posted by: Puljenny on: 5/31/2012 | Points: 25
Hi Soumen,

I am completely lost....Could you give me an other suggestion please....
Actually my example has just 2 tabs but my actual application has 4 tabs....So if one changes then the other 3 should be changed.
My question is in the above reply you said "using Session to store the value selected in combobox1 on selectedIndexChanged event and on load of other tab you can fill combobox2 from the value which is present in Session and then remove that value from Session".
For example if we have 4 tabs named t1, t2, t3, t4 and if combobox selection is changed in t1 and if we navigate to t2 and load combobox2 with value and then If we remove it from the session, then how can we save the value to t3 and t4 when the session is cleared?
Sorry if I ask lot of questions. I am just starting to learn....

Thank You.
Posted by: Sbanerjee on: 6/1/2012 | Points: 25
Hi Puljenny,

Questions are fine and are welcome. We are here in forums to help each other :)
To answer your question, according to your requirement you don't have to remove the value from Session as you need it throughout. I was mentioning to remove as a best practice to minimize load on Session object.


Regards,
Soumen
Posted by: Meenu0099 on: 6/3/2016 | Points: 25
Hi Soumen,

Great Article .Helped me alot.

Login to post response

Comment using Facebook(Author doesn't get notification)