【问题标题】:How to redirect user to another page after Ajax form submissionAjax表单提交后如何将用户重定向到另一个页面
【发布时间】:2013-07-18 20:50:51
【问题描述】:

我在成功完成表单后将用户重定向到感谢页面时遇到问题。发生的情况是,在表单提交后,它会转到一个空白页面 (https://cunet.sparkroom.com/Sparkroom/postLead)...我需要它重定向到感谢页面,同时将表单详细信息提交到“表单操作”中的 URL。

HTML 代码:

<form action="https://cunet.sparkroom.com/Sparkroom/postLead/" method="post" name="theForm" 
id="theForm" onSubmit="return MM_validateForm();" >
...
</form>

Ajax 代码:

<script src="http://malsup.github.com/jquery.form.js"></script> 
<script> 
    $(document).ready(function() { 
        $('#theForm').ajaxForm(function() { 
           alert('form was submitted');
        }); 
     success:function(response) {
           location.window.href = "redirect user to the thank you page";
                }
    }); 
</script> 

JavaScript:

function MM_validateForm() {
if ( !jQuery('#theForm #FirstName').val() ) {
alert('Please input your first name.');
jQuery('#theForm #FirstName').focus();
return false;
}
if ( !jQuery('#theForm #LastName').val() ) {
alert('Please input your last name.');
jQuery('#theForm #LastName').focus();
return false;
}
if ( !jQuery('#theForm #daytimephone').val() ) {
alert('Please input your phone number.');
jQuery('#theForm #daytimephone').focus();
return false;
}
if ( !jQuery('#theForm #Email').val() ) {
alert('Please input your email.');
jQuery('#theForm #Email').focus();
return false;
}
if ( !jQuery('#theForm #BID').val() ) {
alert('Please select your preferred campus.');
jQuery('#theForm #BID').focus();
return false;
}
if ( !jQuery('#theForm #programs').val() ) {
alert('Please select your preferred program.');
jQuery('#theForm #programs').focus();
return false;
}
if ( !jQuery('#theForm #How_Heard').val() ) {
alert('Please select how you heard about us.');
jQuery('#theForm #How_Heard').focus();
return false;
}
return true;
}
// ]]></script>

有谁知道我做错了什么?我需要表单将数据提交到 URL,然后将用户重定向到“谢谢”页面

【问题讨论】:

    标签: javascript html ajax forms redirect


    【解决方案1】:

    您的成功回调语法不正确。应该是:

    $('#theForm').ajaxForm(function() { 
        window.location.href = "/path/to/thankyoupage";
    });
    

    另外,请注意它是window.location.href 而不是location.window.href

    【讨论】:

    • 我刚刚尝试了代码,但它没有将用户重定向到所需的页面,而是成功地将数据提交到 URL,但此后没有重定向:(!
    【解决方案2】:

    你应该使用

    window.location.href = "http://www.google.com";
    

    而不是

    location.window.href = "http://www.google.com";
    

    http://www.w3schools.com/js/js_window_location.asp

    成功应该是作为参数传递给 $.ajaxForm 的函数:

    $('#theForm').ajaxForm(function() { 
               window.location.href = "redirect user to the thank you page";
            }); 
    

    【讨论】:

      【解决方案3】:

      这是一个jQuery解决方案:

      window.location("www.example.com");
      

      【讨论】:

        【解决方案4】:
        //Please try this    
        <script src="http://malsup.github.com/jquery.form.js"></script> 
            <script> 
                $(document).ready(function() { 
                    $('#theForm').ajaxForm(function() { 
                       alert('form was submitted');
                    }); 
                 success:function(response) {
                       if(response){ // check whether response is received
                            location.window.href = "http://your_domain_name/thank-you";}
                       }
                }); 
            </script> 
        

        【讨论】:

          【解决方案5】:

          在完全不同的 OP 上下文中,以下代码对我有用:

          $(document).ready(function() {
            window.location.href = "URL";
            });

          【讨论】:

            【解决方案6】:

            你可以这样试试:

             success: function (data) {
                window.location.href = data.redirecturl;
            },
            error: function () {
                alert('error happened');
            }
            

            【讨论】:

              【解决方案7】:

              应该是

              window.location = "http://www.google.com";
              

              【讨论】:

                猜你喜欢
                • 2013-07-18
                • 1970-01-01
                • 2017-06-26
                • 1970-01-01
                • 1970-01-01
                • 2012-02-04
                • 2013-06-14
                • 2022-11-03
                相关资源
                最近更新 更多