Saturday, October 2, 2010

Click Server button problem in jquery Model popup ASP.NET

Hi All,

If you have ever used JQuery model popup with server side controls on it you might face problem when clicking a server button on it, That the server event is not fired when and hence you can not open perform any server activity inside that popup.

The reason is that JQuery models are designed in a way that they should contain a form tag as an ASP.net server page but when the popup appears div gets out from document object model and gets attached to the end of page and hence it never contained a form tag which stops "runat=server" to work so server events didn't gets fired.

The solution is very simple just add the model popup to the parent form and you are done. i have also attached the sample code.

jQuery(function() {
   var myDialog= jQuery("#DialogName").dialog({ 
                        // SET Properties here 
          });
  // Adding Dialog to Parent form will do the Job
  myDialog.parent().appendTo(jQuery("form:first"));
});


Also Take care of one thing that the addition of model dialog to page must b done inside the page it this is done in external javascript file it wont work.

Happy Coding.

2 comments:

Jamie Grinnell said...

Hello, I have this problem with a fancybox plugin on my ASP VB application. I don't understand the sample code that you have where it says SET Properties here. What properties?

Usman Shabbir said...

The properties that i mentioned in this post are the ones related to Dialog initialization(JQuery control) which in your case is Fancybox and if you dont have any properties leave it empty like
var myDialog= jQuery("#DialogName").dialog();