使用JQuery模式对话捕获响应

时间:2013-01-28 18:58:24

标签: jquery dialog modal-dialog confirmation

我有一个简单的确认对话:

    <script type='text/javascript'>
        function confirmPubGL( theForm )
        {
            theForm.submit.disabled = true;
            var r=confirm('Are you sure you want to press the OK button?')
            if (r==true)
            {
                alert('Submitting form data now.');

            } else {
                alert('Nothing happened.')
                theForm.submit.disabled = false;
            }

        }
    </script>   

    <form name='abc' id='abc' method='post' action='feedme.php' onSubmit="return confirmPubGL(this)">
        <input type=hidden name=action  value='submitme'>
        <input type=submit name='submit' value='Click Me!'>
    </form>

我想使用JQuery&#39; dialogues来修饰它。这些示例看起来很棒,但我还没有看到如何在现有表单中使用它。我对JQuery来说还是一个新手,所以我可能会忽略一些非常容易的事情。

<script>
    $(function() {
        $( "#dialog-confirm" ).dialog({
            resizable: false,
            height:140,
            modal: true,
            buttons: {
                "Do it!": function() {
                    $( this ).dialog( "close" );
                },
                Cancel: function() {
                    $( this ).dialog( "close" );
                }
            }
        });
    });
</script>


    <form name='abc' id='abc' method='post' action='feedme.php' onSubmit="return WhatDoIDoHere()">
        <input type=hidden name=action  value='submitme'>
        <input type=submit name='submit' value='Click Me!'>
    </form>

<div id='dialog-confirm' title='Submit Data?'>
<p><span class='ui-icon ui-icon-alert' style='float: left; margin: 0 7px 20px 0;'></span>You are about to submit data. Are you sure?</p>
</div>

为了将JQuery的确认示例与上面的表单正确合并,我需要更改哪些内容?

1 个答案:

答案 0 :(得分:0)

试试这个:

<script>
    $(function() {
        $( "#dialog-confirm" ).dialog({
            resizable: false,
            height:140,
            modal: true,
            buttons: {
                "Do it!": function() {
                    var confirmMsg = "Are you sure?";
                    if (confirm(confirmMsg)) {
                        // Send your form
                    } else {
                        $( this ).dialog( "close" );
                    }
                },
                Cancel: function() {
                    $( this ).dialog( "close" );
                }
            }
        });
    });
</script>

<强>更新

对不起,我在后面的回答中犯了错误。我不明白你的问题。

<script>
    function WhatDoIDoHere() {
        $("#dialog-confirm").dialog("open");
    }
</script>

希望这能回答你的问题。