Question

我想使用漂亮的jQuery Mobile对话框：

<a href="foo.html" data-rel="dialog">Open dialog</a>

询问用户他是否真的想提交表格。

我的想法是：用户填写表单然后点击提交，这样他就会看到一个对话框，例如“你真的想提交表单吗？是/否”，如果是，表单是用ajax发送到我的insert.php页面，如果没有简单地关闭对话框。

我已阅读官方文档，看起来这只是一个图形调整，可以显示我的jqm网络应用程序的任何#page，如对话框。

如何使用此对话框页面确认/取消我的表单提交？

更清楚：我不想使用标准的javascript：

function insertClienti()
{
$('#form').submit(function(e) {
    if(!confirm('really submit the form?')) {
        e.preventDefault();
        return;
    }
        $.post("insert.php", $("#form").serialize());
});
}

但只有jQuery Mobile的对话框。

感谢您的时间和耐心。

Answer 1

我只是使用了错误的jQuery Mobile组件。

弹出对话框就是为此而设计的，并且非常易于使用。

文档在这里：

http://jquerymobile.com/demos/1.2.0-alpha.1/docs/pages/popup/

以下是我在我的应用中使用的代码（我使用了bassistance验证器）：

$(document).bind('pageinit', function () {
                validaFormInserimento();
                });

function insertClienti()
        {
$.post("insert.php", $("#form_inserimento_clienti").serialize());
        }

function validaFormInserimento()
{
$("#form_inserimento_clienti").validate({
        rules: {
                nick: "required"
        },
        messages: {
                nick: "Campo obbligatorio"
        },
        errorPlacement: function(error, element){
                if (element.attr("name") === "nick") {
                        error.insertAfter($(element).parent());
                } else {
                        error.insertAfter(element);
                }
        },
        submitHandler: function(form){
                $( "#popupDialog" ).popup( "open" );
        }
});
}

function disabilitaSubmit()
{
$('input,select').keypress(function(event) { return event.keyCode != 13; });
}

function insertClienti()
        {
$.post("insert.php", $("#form_inserimento_clienti").serialize());
$( "#popupDialog" ).popup( "close" );
$("#form_inserimento_clienti").each(function() {
       this.reset();
     });
        }

jQuery Mobile：使用对话框让用户确认表单提交

1 个答案: