如何在asp上显示Jquery对话框:单击按钮

时间:2011-03-11 16:36:22

标签: c# javascript jquery asp.net ajax

我是JQuery的新手,在用户点击aspx按钮时尝试显示是/否确认对话框。当对话框显示给用户时,他可以单击是或否按钮,并根据用户操作我想执行代码隐藏文件中存在的不同代码,即在aspx.cs中

我尝试使用以下代码,但没有成功实现我的目标。

aspx页面中的代码:

<link href="jquery-ui-1.8.10.custom.css" rel="stylesheet" type="text/css" />
<script src="jquery-1.4.4.min.js" type="text/javascript"></script>
<script src="jquery-ui-1.8.10.custom.min.js" type="text/javascript"></script>

<script>

    jQuery(document).ready(function() {

        jQuery("#myButton").click(showDialog);

        //variable to reference window
        $myWindow = jQuery('#myDiv');

        //instantiate the dialog
        $myWindow.dialog({
            autoOpen: false,
            width: 400,
            modal: true,
            resizable: false,
            buttons: {
                "Yes": function() {

                },
                "No": function() {
                    $(this).dialog("close");
                }
            }
        });
    }

    );
    //function to show dialog   
    var showDialog = function() {
        //if the contents have been hidden with css, you need this
        $myWindow.show();
        //open the dialog
        $myWindow.dialog("open");
    }

    //function to close dialog, probably called by a button in the dialog
    var closeDialog = function() {
        $myWindow.dialog("close");
    }

</script>

<form id="testconfirmJQ" name="testconfirmJQ" runat="server">
    <fieldset>
    <legend>jQuery UI Modal Submit</legend>
    <p><label for="email">E-mail:</label><br />
    <input id="emailJQ" type="text" name="emailJQ" value="" /></p>
    <p>
        <asp:Button ID="myButton" runat="server" Text="Button" onclick="myButton_Click" />
    </fieldset>
    </form>

    <div id="myDiv" title="Verify Form jQuery UI Style"><p><span class="ui-icon ui-icon-alert" style="float:left; margin:0 7px 0 0;"></span> You entered your e-mail address as:</p><p id="dialog-email"></p><p>
    If this is correct, click Submit Form.</p><p>To edit, click Cancel.<p></div>
</form>

在事件处理程序后面的代码中现在是空的。任何建议将不胜感激!

2 个答案:

答案 0 :(得分:1)

取出asp:按钮的onclick属性。应该没有必要 - 你没有做服务器端的行动。

您也可以将其更改为<input>类型按钮。

答案 1 :(得分:0)

由于jQuery是客户端,并且您希望在.aspx.cs文件中执行服务器端代码,因此您可以尝试保存一个值,指示用户响应提示的内容并进行回发,以便服务器端可以执行适当的代码。

您可以考虑使用可以在回发之前执行客户端代码的Button.OnClientClick Property。仍然使用jQuery对话框。