Albert Laure
Albert Laure

Reputation: 1722

ASP.net Button on click not firing using Jquery Modal Dialog

I have a div that is shown as a Modal dialog.

<div id="div2" style="display: none;" title="Upload Prenda">
        <center>
            <br />
            Select File to Upload:
            <asp:FileUpload ID="PrendaFileUpload" runat="server" Width="345px" />
            <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ControlToValidate="PrendaFileUpload"
                ErrorMessage="File to be uploaded Required" ValidationGroup="X">*</asp:RequiredFieldValidator><br />
            <asp:ValidationSummary ID="ValidationSummary1" runat="server" ShowMessageBox="True"
                ShowSummary="False" ValidationGroup="X" />
            <br />
            &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
            <asp:Button ID="uploadButton" runat="server" Text="Upload" OnClick="uploadButton_Click"
                 Width="100px" />
        </center>
    </div>

here is the jquery for it

 <script type="text/javascript">
$(function() {
$( "#div2" ).dialog({
autoOpen: false,
modal:true,
resizable: false,
 height: 200,
width: 600
});
$( "#toggle" ).click(function() {
$( "#div2" ).dialog( "open" );
});
});
</script> 

the problem is after i press the button to activate the OnClick="uploadButton_Click" the method inside does not fire, any fix for this? sorry im just new in using jquery.

Upvotes: 6

Views: 17392

Answers (4)

user5940155
user5940155

Reputation: 19

This query will fire C# code from JQuery. I tested it:

 $(this).parent().appendTo($("form:first"));

Upvotes: 1

Daniel Anderson
Daniel Anderson

Reputation: 275

The newer versions of JQueryUI use a slightly different convention. In your .dialog() declaration, add this is a parameter:

appendTo: "form",

This fixes the issue for new versions of JQuery, since it builds the dialog box outside the scope of the ASP.NET form. Hope this helps newer users!

Upvotes: 3

Albert Laure
Albert Laure

Reputation: 1722

Well this is the answer that worked for me, im not using any update panel and this is what i used

adding this to the dialog declaration:

  open: function(type,data) {
    $(this).parent().appendTo("form");
  }

found the answer in here so if you want to know more about click the link beside :)

Upvotes: 15

Tyler Durden
Tyler Durden

Reputation: 1026

Try this solution: jQuery modal dialog with postbacks in ASP.NET

This tells jQuery to append the dialog to the form tag rather than the end of the document.

Upvotes: 1

Related Questions