Question

我正在尝试在成功进行jquery电子邮件验证和表单提交后返回“谢谢”消息。我想显示“谢谢”消息并阻止页面重定向到操作URL但仍处理数据服务器端。虽然研究我认为Jquery回调听起来是正确的，但需要一些更多的方向，因为我发现的例子有点遍布。任何人都可以提供一些意见吗？

$("#emailsignup_form").validate();
});

$('#submitemail').click(function() {
    app.ajax.load({
         reqName : 'emailSubmit',
         url: "$httpUrl('Bronto-OptIn')$?email=" + $('#email').val(), 
         selector : '#emailbox',
         callback: function(responseText, textStatus) { }
return false;
    }
});

<form id="emailsignup_form" method="post" action="$httpUrl('Bronto-OptIn', 'fid', 'information')$">
<input id="cemail" name="email" size="25"  class="required email" />
<input class="submit" id="submitemail" type="submit" value="Submit"/>
</form>
<div id="emailbox"></div>

Answer 1

假设您添加div以显示帖子的结果

<form id="emailsignup_form" method="post" action="">
    <input id="cemail" name="email" size="25"  class="required email" />
    <input class="submit" id="submitemail" type="submit" value="Submit"/>
</form>
<div id="postresult">
</div>

您可以使用$.post()这样的

发布数据

$(function(){
    $("form#emailsignup_form").submit(function(e){
        e.preventDefault();
        $.post(
            "processdata.php", 
            $(this).serialize(), 
            function(data){
                //Your code to process returned data goes here
                $("#postresult").text("Thank you!");
            }
        );
    });        
});

Answer 2

我能够通过将上面的代码修改为：

来实现返回成功消息

$('#emailsignup_form').validate({
    rules: {
        email: {
            required: true,
            email: true
        }
    },
    messages: {
        email: {
            required: "this is required",
            email: "this must be a valid email"
        }
    },
    submitHandler: function (form) {
        app.ajax.load({
        reqName : 'emailSubmit',
        url: "$httpUrl('Bronto-OptIn')$?email=" + $('#email').val(), 
        selector : '#emailbox',
        callback: function(responseText, textStatus) {  }
        });
        return false;
    }
});
});

<div id="emailbox">
<form id="emailsignup_form" name="emailsignup_form" method="post" action="">
<input type="text" name="email" id="email" />
<input type="submit" name="submitemail" id="submitemail" value="Submit" />
</form>
</div>

表单提交后返回“成功”消息

2 个答案: