I have a webgrid on a page that displays the Orders for a particular customer. I also have another section/panel on the same page consisting of Textboxes and dropdowns that displays the details of a particular Order.
I would like the text and values of the Textboxes and dropdowns to change(Order details) based on the Selected Row of the webgrid.
Basically, when the user clicks on a particular Row (Order) on the webgrid, the Order Details section should display the information for that particular Order.
What's the best way to accomplish the above scenario ?
Great, this should work.
Thanks for the help.
When you handle the ActiveRowChange event, the grid will trigger a postback whenever the active row changes.
By wrapping the grid in a WARP or UpdatePanel, only the contents of that WARP/UpdatePanel will be refreshed, rather than the whole page. (There are exceptions to this, but those exceptions need to be manually allowed.) The result is that the page won't "blink" on the user each time the active row is changed, so the interface will be a bit cleaner. The contents of the WARP/UpdatePanel will still be refreshed, so there is still some performance cost - it's simply not as noticable as a full-page postback.
Thanks Vince.
The 2nd approach seems to be the most optimal.
I do have the the data for the other controls (Details section) available, so I guess a Postback will be okay but I want to know how would wrapping the controls with a WARP or UpdatePanel help ?
There are three approaches I can think of. Which one is better depends on how much data you have and where it's located.
The first is to use the grid's Row Edit Template functionality. This is best if you're displaying fields already present in the grid, and when these fields don't require data binding. Since you're showing "Order Details" (which I suspect is likely handled by another grid), this is likely not going to be an option for you.
The next approach is to handle the server-side ActiveRowChange event. During the postback, you'd read the corresponding information based on the newly-activated row, and populate other controls on your page accordingly. This approach is the best if:
Another approach is to handle the grid's client-side AfterRowActivate event. In this JavaScript event, you'd read the corresponding information from the grid (or from wherever you're storing it on the client) to populate the other controls. This approach is best if: