Master Details using AJAX and the UpdatePanelPopupExtender

55 Comments

• I am really impressed with the control. It is really wonderful and very easy to use control. The functionality it provides is really great.
  

• Thanks for you contribution. This simplifies things for a project I'm working on.  Anything that saves room on the screen helps.
  

• Awesome control. I am playing with it as I type. But I had a quick question...My DetailsView in the Wizard is using an ObjectDatasource instead of the SQLSource...how can I expose the ID from the initial Gridview to my ObjDataSource?
  
  Cheers!
  

• Better than i would ever.
  

• Looks impressive !! I will really give it a try :)
  

• That is a really great funcionality, but how do you do it?
  You only show, but don't explain :(
  

• Nuno,
  The sample code link is included at the end of the post.
  

• Raj, this is a wonderful tool, well designed and easy to use, thanks for sharing it with us!
  

• I have found your control really useful. I was wondering if you could give me some advice on how to modify the control in order to make it work similar to the AJAX Toolkit's ModalPopUpExtender, I mean to gray the backgroud behind the UpdatePanelPopUpExtender and to disable all interactions with the page elements behind it.
  
  Would you mind to help me on this?
  

• Hi Raj - Excellent control :) Have been incorporating into my site. However, as the last post mentioned, is there a way to disable interactions with page behind the popup? I am finding a user opens the popup and edits the entry. If they accidently click outside the popup on the page behind or just press the enter key, the popup  closes and all updates are lost. If you could provide some way or some advice on how to stop this happening, it would be greatly appreciated ! Many Thanks for all the work you have done on this ! :)
  

• U r answer to my qustion about this AJAX control
  

• Hi Raj
  This is control is amazing, I wish i had the skills to create such a control hehehe (One Day I will have the skills.) Its quite obvious I'm new to ASP.NET and AJAX, so I've got just one thing that I would like you to help me with or maybe 2. I've been coding in VB since asp days so I don't really know C# and your entire Project is in C#, I was wondering if you had the same project in VB?
  and being a VB person I seem to always find example C# and I cant really learn from because I don't know were to start. Is there a way that I can convert from C# to VB?
  anyway thanks in Advance.
  

• is there a way the above code can be make it to AutoComplete? instead of click on search button? and also when the user click on select i want to that value to be in the textbox, wondering how would you do?
  thanks.
  

• Hi Raj
  I did it, I was able to convert the code from C# to VB! YEAH!!! it was actually quite easy, now I'm able to use the UpdatePanelPopupExtender control. I'm going to use it to Display a Form. anyway back to coding....
  later
  

• Hi Raj,
  i have implemented Master/Detail sample into my project everything is good but i have to click TWICE sometimes more then TWICE to get DetailsView, why is that happening?
  anybody?
  thanks.
  

• does anybody happen to figured out?
  Wednesday, June 13, 2007 6:52 PM by Alejandro García:
  I have found your control really useful. I was wondering if you could give me some advice on how to modify the control in order to make it work similar to the AJAX Toolkit's ModalPopUpExtender, I mean to gray the backgroud behind the UpdatePanelPopUpExtender and to disable all interactions with the page elements behind it.
  Would you mind to help me on this?
  

• Hi Raj.
  
  Awesome control. I was hoping you can help me with this. Instead of detail view i would like to use some label and textboxes and fill values in to it based on the row selected. how can i get the selected value in code behind. is there a method or properties i can use to get this value.
  
  Raj
  

• Raj, thank you very much, this is great, just what I needed!
  

• Hi Raj,
  This is a Awesome Control i ever seen. I am trying to incorporate the controls provided by you in my project. As many of the people asked how to stop closing the popup whenever user clicks anywhere in the webpage.
  Hope you would help me in this. Thank you very much.
  

• The reason why the popup is hidden is to preserve the state of the page. For example, lets say you have the popup visible and we left it visible while someone performed some other action on the page that
  a) caused the page to partially refresh
  b) deleted the record being viewed
  c) caused the position of the gridview to be changed.
   
  Actions like this and others make the item being viewed in the popup in a "dirty state", which is why it is hidden when you click on the page.
  
  
  I think you can comment certain lines in the javascript code which will prevent the popup from being hidden but do so at your own risk.
   
  
  Raj
  
  

• I've having some trouble with the UpdatePanelPopupExtender inside a multiview.  When I display a different view, the controls javascript wants to fire, but since that particular view is not visible I get javascript errors.  (it's trying to set the style attribute to hide/show the element and the element does not exist)
  
  

• Thank you very much Raj.
  

• Hello Raj, Thanks for the great toys!
  I was reading through this last post and I wondered if I could avoid those issues from happening if I referenced the button control for the event of clicking a row?
  
  I am trying set an OnRowCreated="RowCreated" reference in the gridview to link with the asp:ImageButton itemTemplate control?
  
  Currently I have added my event to change color when I click a row in the mypage.cs file:
  
  protected void RowCreated(object sender, GridViewRowEventArgs e)
  {
  e.Row.Attributes.Add("onClick", "this.style.background='#FFC0C0'");
  }
  
  Would wiring it up to run the same as the button still cause these failures you spoke of?
  

• Chris,
  
  Doing that will not break anything. You will have a UI issue though. Anytime you click on a row, it will get highlighted and it will remain like that since there is no code to revert the row back to its original color.
  
  You could fix this by causing the GridView to refresh on async postback or you may be able to write some additional JavaScript code to enumerate the rows and revert them back to their color on async postback. IMHO, highlighting the row is unnecessary since you already know which row you are working with by the little triangle on the left.
  
  Hope that helps.
  
  Raj
  

• Thanks Raj! What I really wanted to do was have the entire row highlight work the same as clicking the image button. Brings up the DetailsView data of that of that GridView row?
  I can't seem to find the CSS they used in the AJAX demo of their GridView update panel working where any click on the row fires the details view.
  

• Simon,
  
  Read this:
  
  http://www.asp.net/ajax/documentation/live/overview/UpdatePanelOverview.aspx
  
  Look under the section "Controls that Are Not Compatible with UpdatePanel Controls"
  
  Raj
  

• Hey Raj, How are you?
  Well Im working on grid view. what I wanted is
  -> when ever i select a data I need a popup which displays the details of that particular data without refreshing the page & I need to call the details from the another control.
  to be more specific -> I need to get the controls from different ascx files on my default.aspx file.
  -> I need to extend the selection of the data couple of times.
  Thanks,
  Sagar
  

• I get the following stack trace and have not been able to veiw your product:  
  Error 1 Could not load type 'System.Web.UI.Compatibility.CompareValidator' from assembly 'System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35'. (C:\Downloads\UpdatePanelUpdateViaScript\UpdatePanelUpdateViaScript\web.config line 22) C:\Downloads\UpdatePanelUpdateViaScript\UpdatePanelUpdateViaScript\Default.aspx 5
  

• When using this great extender, I sometimes get the error "elt has no properties" when raising a linkbutton event. (In IE, the error message is "style is null or not an object".) I can work around it by adding a asp:PostbackTrigger to the updatepanel, but that is a pretty ugly work around off course. Any ideas, anyone?
  Kind regards Lars
  

• hey raj
  great extender!
  i wish i found it earlier
  
  i have a question -
  im putting a datalist in the UPPEx
  the datalist is filled with links to the db
  hitting a link updates the db
  it all works great
  
  ...
  except that hitting the link
  doesnt close the panel after it updates
  
  any thoughts?
  all my divs and spans are set
  please help
  thanks!
  

• toy,
  
  Call the .Hide() method on the UpdatePanelPopupExtender from code behind.
  
  Raj
  

• hey raj -
  
  thanks that worked like a dream
  
  i love this control!
  
  so my next question is -
  
  using your flan project -
  
  my intellisense seems to be messed up
  
  i put that datalist in the UPPEx instead of the details view
  
  and now when i try to access it via code-behind
  
  it deosnt recognise it as a legal control
  
  if i use it anyway the code compiles fine
  
  im just a little spoiled and
  
  would like to have my intellisense popup my answers for me...
  
  

• Hi Raj,
  
  I am trying to use this amazing control in my project. When I click on details icon the popup opens fine with my detailsview. Though, I spent a long time trying to figure out why it always the record shown on detailsview is always the fisrt record from my datasource.
  
  I saw that you left a comment in you code:
  //We have declared that UpdatePanel2 should refresh when the SelectedIndex for GridView1 changes
  //
  
  So I am using the trigger, but unfortunately it doesn't work.
  What else I might be doing wrong?
  
  Thanks.
  

• Leonardo,
  
  I don't think you have setup the DetailsView control to change based on the SelectedValue of GridView1.
  
  

• >i have one panel that requires an ID from selected value of the gridview
  
  Toy,
  Here is one way of doing it:
  http://forums.asp.net/t/1108433.aspx
  
  

• First of all thanks for the wonderful code. I was able to get your VS2005 download to work perfectly. However, in your VS2008 I'm getting design time errors in the Updatepanels that say "Error Creating Control" -UpdatePanelPopupExtender1 A script manager must exist on the current page. Have you experienced this? and if so, is there an easy work around?
  

• I'm getting design time (not runtime) errors with the UpdatePanelPopupExtender. The error that is on the control is specifically, ["Error Creating Control" -UpdatePanelPopupExtender1 A script manager must exist on the current page.] When this error occurs, your wonderful DetailsView controls disappear from view in the designer. But the code does compile and run just fine. It's the design view I'm refering to. (If you just code via HTML, I'm wondering if you didn't notice this issue, or perhaps, I need to re-install Visual Studio 2008).
  
  

• Mark,
  
  I see the error in design mode. I will release a fix sometime tonight. All I need to do is add a this.DesignMode check in the extender.
  
  Thanks for letting me know.
  
  Raj
  

• Mark,
  
  I see the error in design mode. I will release a fix sometime tonight. All I need to do is add a this.DesignMode check in the extender.
  
  Thanks for letting me know.
  
  Raj
  

• Hi,
  
  when the page loads (and the popup should be invisible), the popup always seems to suddenly flicker, before it gets hidden again. Is there a way of getting rid of this?
  
  Kind regards Lars
  
  

• Hi Raj,
  
  I've just seen your answer about my question regarding to select a specific record on detailsview when clicking to the "details icon" of the GridView.
  
  You were right, I am not using asp:ControlParameter and the reason is because it is not supported, because I am using a csla:CslaDataSource.
  
  Is there another way around to get an specific record selected on the detailsview based on the selected value of the grid?
  
  Appreciate your help.
  Thanks a lot.
  

• Leonarda,
  
  The CslaDataSource raises the SelectObject event. Handle that event and set your parameter there.
  
  Raj
  

• nice control.... very useful
  

• AJAX search
  The results are returned in a multiple column
  GridView with the GridView paging turned on.
  which code should i download to get the Ajax Search
  

• Dear Raj.
  
  I'm getting the "error creating control" with UpdatePanelPopupExtender1 in design time on VS2008.
  
  Did you released the fix? Where?
  
  Thanks.
  

• Line 132: return sm;
  Line 133: }
  Line 134: throw new HttpException("A ScriptManager control must exist on the current page.");
  Line 135: }
  Line 136: }
  
  
  Source File: E:\Softwares\Flan\FlanAjaxControls-211\Development\FeatureBranch1\Flan.Controls\UpdatePanelPopupExtender\UpdatePanelPopupExtender.cs Line: 134
  

• I fail to see a control in designer. I was able to in vs2005. Any way I can fix this problem by myself? thx :)
  

• This is a great control, but I am not able to get it to work with drag & drop functionality. I have tried it with the dragpanelextender in ajax control toolkit.
  
  Are there any plans of adding drag & drop functionality to this control?
  
  /Fredric
  

• Is there anyway to use a checkbox?
  

• Hi Raj,
  I had trouble downloading the source code from the site you mentioned.
  Please advise
  thanks
  ajay
  

• Hi Raj,
  
  You have used the SQL data source -> to populate the details page/panel.
  
  How would one go about if the data in the details - popup - panel is populated by a Getmethod() ?
  
  Please help..
  
  thanks
  ajay
  

• Hye Raj i Must say u have done work very hard on this ....Hats off to ur efforts...
  

• Is there a way to make the panel extend upwards(so the callout is at the bottom corner of the panel)?
  Im using the panel at the bottom of a page.  It contains an accordion control, and when it extends down, the user has to scroll every time.
  

• Hi, I have been using your component and I think that is genial. Sometimes I experimented some errors, that I think it is caused by a bad configuration or something like that, becouse when I run an application in my VS runs correctly, but when I publish my application on the server doesn't run or in some cases it runs correctly. I compared sources codes and I saw the same code when I show the component. Which could be a cause of my problem??
  

• Hi,
  
  Would it be possible to use the DragPanelExtender control with this control?
  
  At this moment I am trying and after pressing a button inside of a panel, the position will be changed. It is not kept!
  
  Any ideas?
  
  Thanks in advance.
  

• I found a problem. If I put a textbox and a requiredfieldvalidator control in your sample(for example master_detail_with_edit sample).
  
  The web page can popup but I can't edit if I don't input a character in that textbox.