Video: How Do I: Trigger an UpdatePanel Refresh from a DropDownList Control?

Presenter:Joe Stagner

In most of our videos on the ASP.NET AJAX UpdatePanel, we have used a Button control to cause an UpdatePanel to refresh its content. Yet we may use any event raised by any other ASP.NET server control. This video uses the SelectedIndexChanged event of the DropDownList control as a trigger for refreshing an UpdatePanel control. We see also how we can dynamically change the stylesheet class associated with the controls contained in the UpdatePanel control.

The following text is a software generated transcript of the video. Click on a minute link to jump to a location within the video


Minute 0

Into sealed up in a straight to relatively simple techniques combine one using the selected index changed event from the drop down list control as an event trigger for updating optic panels and to dynamically changing the associated stylesheet class with the controls are contained inside the is good at Ajax update often would demonstrate optic panels in the highlight videos I use the click event from a button control as he as the event trigger for updating the update panel but I ve got lots of e mail from folks that seem not to be aware that you can use really any event from any control of it that s on your page as the event trigger for Iraq to go so was concerned visual developer express greater new Ajax control toolkit enables website on its limit of using style sheets in this demo so I m going rabbit and so

Minute 1

Violence on my desktop and included in the project and then drag it to my page so that I have a reference to it and I can start using it and next I really don t grab and update panel from my exact extensions tool to have in my Visual Studio toolbox then they go and grab a label control when I m this is through the quintessential of a panel demonstration where we have this little control and good without the text double click on my page generated page load event that were discovered populate with the current date and time and it s so much this are the quintessential update panel demonstration now know he does have some classes

Minute 2

Lines don t we start with a white background for a label control to really go into the province of her label control and specify the CSS class that we will use going to our code behind your new milk that now has little control the CSS classes assigned next to do is outside our update panel just as we would ve gotten control work and add a drop down list control so scrap one of those and were going to enable auto post back and it will work if you don t do that then would edit the items purchased at a few items here let s add 12345

Minute 3

And we re going to make these colors so make right read and green food and then he ll this resource for any here in our update their own we re going to specify triggers collection and then inside that collection will specify on a sink post that trigger then the control ID is going to be drop down list one and use it

Minute 4

Aim is going to be selected index changed in and close our XML okay so when the selected item in the drop down list changes the update panel is going to get updated now I need to thought that was here as I ve use the button controls click event in previous demonstrations were to say there s a trigger is the drop down list is the control and the selected index changed his view that the we want a cause that we want to cause this update panel to update anything you can use this mechanism with any as the other control on your page that has an event he can catch ex as the

Minute 5

Limited to using optic panels now says he wants something to have to win this up a tale gets updated let s hop back over to design mode here for a second look at the update panel switch to event views and generate an event for selected index change and will really do here is dynamically update the caller of the other background color of the label one control cell lets say if drop down list one selected don t do equal red then

Minute 6

L one CSS class equal class who had an amusing class read because class read is the name that I do find in my CSS file palace in the river have really be the default else if

Minute 7

Blue and green and yellow in the witch in her classes to match blue green your wealth I would use a CSS classes to started or all our users in this case to serve custom by the way things look and if you wanted to weaken them save default values in an ASP net profile entry for her own for this user

Minute 8

Okay so it s good to see if we many coding mistakes also by default to change to read green and blue yellow back to Whitehorse and so we got here is refusal to know the button control as a writer for a panel and in our case you drop down list in the him in the selected the selected item changed event continues any event accessible from any control that site is beautiful use of a page and secondarily we re dynamically assigning the CSS class name to the background color for this to the CSS class on property of our label control to change the way that control looks in law works on show on the fly

Minute 9

In a very Ajax style from a harmful page

Click here to go to original video page