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

Posted 2023-05-09

【中文标题】表单提交后返回“成功”消息

【英文标题】：Return "success" message after form submit

【发布时间】：2013-05-03 03:47:19

【问题描述】：

我试图在成功的 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>

【问题讨论】：

你需要的是ajax！

在 target.php 中创建 cookie 并显示是否设置了 cookie，在主页上更改

【参考方案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!");
            
        );
    );        
);

【讨论】：

您好，我正在尝试使用 Ajax 来执行此操作。对不起，我应该在上面提到。我正在编辑上面的代码以显示。为了解决这个问题，我已经绞尽脑汁好几个星期了！

@Jgunzblazin 答案正是如此。 $.post 是 jQuery ajax 函数的简写。您是否阅读了我在答案中给出的链接$.post()？

没有意识到这是一个链接。现在阅读。

【参考方案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>