Question

当我包含modal时，ok按钮不会触发：true，

Aspx：

<script type="text/javascript">
            $(function () {
                $("[id*=Button2]").live("click", function () {
                    $("#dialog").dialog({
                        modal: true,
                        buttons: {
                            Ok: function () {
                                $("#<%=Button3.ClientID %>").click();                           
                            },
                            Close: function () {
                                $(this).dialog('close');
                            }
                        }
                    });
                });
            });

     </script>

<input type="button" id="Button2" value="click here" name="Button2" />

   <asp:Button ID="Button3" runat="server" Text="Button" style="display:none;" OnClick = "Button_Click"/>

    <div id="dialog" style="display:none">
        <asp:Label ID="Label1" runat="server" Text="Enter ur name"></asp:Label>
        <asp:TextBox ID="TextBox1" runat="server" Text=""></asp:TextBox>

    </div>

我需要在单击ok按钮时调用此函数，并且当modal：true包含在jquery中时不调用此函数

C＃：代码背后：

 protected void Button_Click(object sender, EventArgs e)
        {
            ClientScript.RegisterStartupScript(Page.GetType(), "key", "alert('Button Clicked')", true);

        }

Answer 1

可能你需要这样的东西。

如果你不能回复为什么不使用ajax

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
    <link rel="stylesheet" href="/resources/demos/style.css">
    <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
    <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
    <script>
        $(function () {
            $('#btnModal').on('click', function (e) {
                e.preventDefault();
                $("#dialog").dialog({
                    modal: true,
                    buttons: {
                        Ok: function () {
                            // alert('Hi');
                            //  document.getElementById('btnModal').click();
                            var data = {}
                            data.x = "1";
                            $.ajax({
                                type: "POST",
                                url: "Dialog.aspx/GeTestJsons",
                                data: JSON.stringify(data),
                                contentType: "application/json; charset=utf-8",
                                dataType: "json",
                                success: function (result) {
                                    //alert(result.d);//data from backend
                                    $('#dialog').dialog('close');
                                }
                            });


                        },
                        Close: function () {
                            $(this).dialog('close');
                        }
                    }
                });
            });

        });
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <div>
            <asp:Button ID="btnModal" runat="server" ClientIDMode="Static" Text="Click me"  />
        </div>


        <div id="dialog" title="Basic dialog" style="display: none">
            <p>
                This is the default dialog which is useful for displaying information. The dialog
                window can be moved, resized and closed with the 'x' icon.</p>
        </div>
    </div>
    </form>
</body>
</html>

和.cs

[WebMethod]
    public static String GeTestJsons(String x)
    {

        return "hi";
    }

jquery模式弹出对话框按钮没有触发？

1 个答案: