|
Using jQuery Dialog with ASP.NETPosted on 08. Sep, 2009 by Wim Haanstra in C#, Snippets. |
I have been playing around with jQuery a bit lately and I wanted to use the nice dialog boxes on my new project. The problem with the dialog boxes is, that they do not create a postback when one of the buttons is clicked. Also the values of any controls inside the dialog are always empty, when using the dialog box.
I just will be posting my code here, to let you see how I solved the problem.
First, my JavaScript code to show the dialog I want:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 | function showDialog(ID) { var dlg = $("#" + ID).dialog({ bgiframe: true, height: 165, width: 450, modal: true, buttons: { Ok: function() { $(this).dialog('close'); __doPostBack = newDoPostBack; __doPostBack("aspnetForm", null); }, Cancel: function() { $(this).dialog('close'); } } }); dlg.parent().appendTo(jQuery('form:first')); } function newDoPostBack(eventTarget, eventArgument) { var theForm = document.forms[0]; if (!theForm) { theForm = document.aspnetForm; } if (!theForm.onsubmit || (theForm.onsubmit() != false)) { document.getElementById("__EVENTTARGET").value = eventTarget; document.getElementById("__EVENTARGUMENT").value = eventArgument; theForm.submit(); } } |
Now here is my simple dialog, and the code to initiate it.
1 2 3 4 5 6 7 | <div class="btn-140-addserver" onclick="showDialog('addServerDialog')" />
<div id="addServerDialog" title="Add server" style="display: none;">
<p>
Please enter a server name here. It can be anything you like:<br />
<asp:TextBox ID="txtServerName" runat="server" Width="410px" />
</p>
</div> |
