表单提交后的 jQuery UI 对话框答案

【问题标题】：jQuery UI Dialog box after form submit表单提交后的 jQuery UI 对话框
【发布时间】：2009-11-27 18:00:02
【问题描述】：

我有一个用户可以提交信息的表单。提交可以成功也可以不成功。

在任何一种情况下，我都希望有一个对话框告诉用户它是否成功。
页面在提交表单时自行加载。因此，页面不是通过提交的阿贾克斯。

我知道如何通过单击按钮/链接等来触发对话框。但是在表单提交后如何使用jQuery UI Dialog？

更新

我找到了解决方案。 You can read the solution in this thread.

【问题讨论】：

刚刚看到您的更新。 :/ 别介意我的回答 :)

标签： php jquery jquery-ui-dialog

【解决方案1】：

不要使用 type='submit'，而是将 jQuery 事件绑定到普通按钮，通过 ajax 处理表单。当您通过 ajax 获得结果时，您可以在对话框上显示 ajax 请求的结果（PHP 在对话框上生成消息），或者您可以有一个条件来检查它是否成功，然后采取适当的措施。

这是一个在表单中带有 a 的示例。（编码有点草率）

$(document).ready(function() {
        $('#submit').click(function() {
            name = $('#name').val();
            email = $('#email').val();
            number = $('#number').val();
            message = $('#message').val();  
            $.post("contact.php", //PHP file to send POST to
            { ajax: 'yes', name: name, email: email, number: number, message: message }, //POST fields to send
            function(returned) { //What to do if the POST finishes. 'returned' is the value recieved back from the script.
                if (returned == 'done') {
                    //PHP script returns the word 'Done'
                        alert('Submit successful');
                    });                 
                } else {
                    alert('An error has occured');
}});});});

【讨论】：

【解决方案2】：

您应该能够将事件处理程序绑定到表单上的提交事件。

$("form_name_here").bind("submit", function(){$("dialog").open()})

或者任何显示对话框的方法。我不记得了。另一个选项是使用 jQuery 表单插件，因为我假设您使用 ajax 提交表单。有了它，您可以为与表单提交相关的所有事件传递方法。之前、之后、成功、失败等。

【讨论】：

表单未使用 Ajax 提交。所以你的解决方案只会在点击后显示对话框，但在页面重新加载之前。
您的脚本应该在页面打开时尝试打开对话框。服务器响应将不得不添加一个 url 参数或在脚本中设置一个变量来确定应用程序处于什么状态（新、失败、成功）。我认为这是您唯一的选择，因为您没有使用 ajax。