使用带有JQuery对话框的ClientScript.RegisterStartupScript

时间:2012-09-27 18:32:01

标签: jquery asp.net jquery-ui-dialog code-behind clientscript

我在后面的aspx代码中有以下方法,它显示了一个jquery对话框。如果用户点击对话框中的“提交”,此方法是否可以返回 true

    Sub DisplayDialog()
        Dim title As String = "title"
        Dim content As New StringBuilder()
        content.Append(@"<script type=text/javascript>
          $(function () {
           $('#dialog')
            .dialog({
            title: 'title',
            modal: 'true',
            buttons: {
                'Submit': function () { 
                },
                'Cancel': function () {
                    $(this)
                        .dialog('close');
                }
            }
        });
    });
</script>")
     ClientScript.RegisterStartupScript(Me.[GetType](), title, content.ToString())
    End Sub

修改

以下是我所拥有的更完整的图片:

Sub GridView1_onRowCommand(ByVal sender As Object, ByVal e As GridViewCommandEventArgs)
    Select Case e.CommandName
        Case "Upload"
            DisplayDialog()
            //Get result here from jquery dialog. Do something if result was true             
        Case "Something"
     End Select
End Sub

1 个答案:

答案 0 :(得分:1)

如果您想使用模态对话框的返回来执行操作,这是您应该遵循的模式:

<script type="text/javascript">
    $(function () {
        var $dialog = $("#dialog");
        var $foo = $("input:submit[id$=foo]");
        var confirmed = false;

        $dialog.hide();

        $dialog.dialog({
            width: "300px",
            modal: true,
            autoOpen: false,
            buttons: {
                OK: function (e) {
                    $dialog.dialog("close");
                    confirmed = true;
                    $foo.click();
                },
                Cancel: function (e) {
                    $dialog.dialog("close");
                    confirmed = false;
                }
            }
        });

        $foo.click(function (e) {
            if (!confirmed) {
                $dialog.dialog("open");
            }

            return confirmed;
        });
    });
</script>

    <div>
        <asp:Button Text="Submit" runat="server" ID="foo" OnClick="foo_Click" />
    </div>
    <div id="dialog">
        <asp:Label Text="Are u sure u wanna do it?" runat="server" />
    </div>

基本上,您使用一个标志来指示按下了什么按钮,并在单击按钮时返回该标志。

您可以采用此示例并根据您的特定需求进行调整

This is the full working Example on my GitHub