使用jQuery Dialog后,Button无法正常工作

时间:2013-12-26 03:03:10

标签: javascript jquery html forms dialog

我想使用jquery对话框创建一个注册表单但是在我使用jQuery Dialog并单击按钮打开表单之后#btnsubmit Button无效,在它工作之前有人可以帮助我解决我的问题我一直在尝试现在找到2天的答案,找不到答案,我就是新手了:P

JS

$(function () {
        $("#dialog").dialog({
            autoOpen: false,
            width: 630,
            height: 630,
            draggable: false,
            resizable: false,
            modal: true
        });

        $("#btnaddnew").click(function () {
            $("#dialog").dialog("open");
            return false;
        });
    });

HTML

<div id="dialog" title="Add/Edit User">
<asp:UpdatePanel ID="addpanel" runat="server">
<ContentTemplate>
<table>
    <tr>
        <td><div id="registerform">
              <div class="formrow">
                <table>
                <tr>
                    <td><label for="firstname">First Name</label></td>
                    <td><asp:TextBox ID="txfirstname" runat="server" class="basetxt" /></td>
                </tr>
                <tr>
                    <td><asp:RequiredFieldValidator ID="rfvfirstname" runat="server" ForeColor="Red" Display="Dynamic" ErrorMessage="Required" ControlToValidate="txfirstname" style="margin-left:20px" /></td>
                </tr>
                </table>
              </div>

              <div class="formrow">
              <table>
              <tr>
                <td><label for="lastname">Last Name</label></td>
                <td><asp:TextBox ID="txlastname" runat="server" class="basetxt" /></td>
              </tr>
              <tr>
                <td><asp:RequiredFieldValidator ID="rvflastname" runat="server" ForeColor="Red" ErrorMessage="Required" Display="Dynamic" ControlToValidate="txlastname" style="margin-left:20px" /></td>
              </tr>
              </table>
              </div>

              <div class="formrow">
              <table>
                <tr>
                    <td><label for="address">Address</label></td>
                    <td><asp:TextBox ID="txaddress" runat="server" class="basetxt" /></td>
                </tr>
                <tr>
                    <td><asp:RequiredFieldValidator ID="rfvaddress" runat="server" ForeColor="Red" Display="Dynamic" ErrorMessage="Required" ControlToValidate="txaddress" style="margin-left:20px" /></td>
                </tr>
              </table>
              </div>

              <div class="formrow">
              <table>
                <tr>
                    <td><label for="age">Age</label></td>
                    <td><asp:TextBox ID="txage" runat="server" class="basetxt" /></td>
                </tr>
                <tr>
                    <td><asp:RequiredFieldValidator ID="rvfage" runat="server" ForeColor="Red" Display="Dynamic" ErrorMessage="Required" ControlToValidate="txage" style="margin-left:20px" />
                    <asp:RegularExpressionValidator ID="revage" runat="server" ForeColor="Red" Display="Dynamic" ErrorMessage="Not Valid" ControlToValidate="txage" ValidationExpression="^[1-9]\d{0,2}$" /></td>
                </tr>
              </table>
              </div>

              <div class="formrow">
              <table>
                <tr>
                    <td><label for="mobile">Mobile #</label></td>
                    <td><asp:TextBox ID="txmobile" runat="server" class="basetxt" /></td>
                </tr>
                <tr>
                    <td><asp:RequiredFieldValidator ID="rvfmobile" runat="server" Display="Dynamic" ForeColor="Red" ErrorMessage="Required" ControlToValidate="txmobile" style="margin-left:20px" />
                    <asp:RegularExpressionValidator ID="revmobile" runat="server" ForeColor="Red" ErrorMessage="Not Valid" Display="Dynamic" ControlToValidate="txmobile" ValidationExpression="^\d{11}" style="margin-left:20px" /></td>
                </tr>
              </table>
              </div>

              <div id="btnc2">
              <asp:Button ID="btnsubmit" runat="server" class="submitbtn" Text="Submit" onclick="btnsubmit_Click" style="margin-left: 10px" />
              <asp:Button ID="btnreset" runat="server" class="submitbtn" Text="Reset" 
                      style="margin-left: 30px" onclick="btnreset_Click" CausesValidation="false" />
              </div></td>
    </tr>
</table>
</ContentTemplate>
</asp:UpdatePanel>
</div>

按钮添加新

<asp:Button ID="btnaddnew" runat="server" class="submitbtn" Text="Add New" 
                            style="margin-left: 10px; margin-top: 10px" onclick="btnaddnew_Click" CausesValidation="false" />

1 个答案:

答案 0 :(得分:1)

您应该使用jQuery .on方法为按钮元素指定单击处理程序。应该是这样的:

$(function () {
    $("#dialog").dialog({
        autoOpen: false,
        width: 630,
        height: 630,
        draggable: false,
        resizable: false,
        modal: true
    });

    $("#dialog").on('click', '#btnaddnew', function () {
        $("#dialog").dialog("open");
        return false;
    });
});