Question

我有一个调用onSubmit="return report();"的表单。我在单独的文件中有这个javascript函数。我想创建自己的jQuery UI对话而不是javascript确认，但我根本不理解jQuery。我应该如何更改javascript函数report（）以获取jQuery UI对话框？

我的部分php文件：

<form method="POST" action="add.php" name="alert" id="alert" onSubmit="return report();">
    //some inputs
    <button class='btn btn-primary' type='submit'>Send it</button>

我的js文件：

 function report() {

    var report="Some text: \n\n";
    //There is code in simple javascript

    raport=raport+"\n";
    raport=raport+"If the are no mistakes click OK";
    return confirm(report);
    }

Answer 1

由于我不是inline-javascript的朋友而且你想使用jquery我修改了你的代码。

此代码将在提交按钮上绑定事件列表器并阻止默认操作（在本例中为提交）。如果用户确认对话框，将手动触发提交事件。

$('button[type=submit]').on('click', function (event) {

    event.preventDefault();

    var $this = $(this);
    var raport = "Some text: \n\n";
    //There is code in simple javascript
    raport = raport + "\n";
    raport = raport + "If the are no mistakes click OK";

    $("#dialog-confirm").text(raport).dialog({
        modal: true,
        buttons: {
            "OK": function () {
                $(this).dialog("close");
                $this.closest('form').submit();
            },
            Cancel: function () {
                $(this).dialog("close");
            }
        }
    });

});

<强> Demo

<强>参考

单击“提交”后创建jQuery UI对话框

1 个答案: