在联系表单上重定向的问题 [英] Problems with redirect on contact form

查看:111
本文介绍了在联系表单上重定向的问题的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述



我已经使用了位置/路径,但是不会从主页面移动。

我无法弄清楚为什么在一切看起来不会重定向。 / p>

电子邮件发送和表单很好,但不能重定向到感谢页面或错误显示。



这里是我的代码JS / PHP / HTML下面



预先感谢,希望你能发现一些东西。

JS :

  / * ======================= =========== 
英雄表格验证
============================ ========= * /
$('#hero-submit')。click(function(e){

//停止表单提交并检查验证
e.preventDefault();

//变量声明
var error = false;
var fname = $('#hero-fname')。val );
var email = $('#hero-email')。val();
var username = $('#hero-username')。val();

//表单字段验证
if(fname.length == 0){
var error = true;
$('#hero-fname')。parent('div')。addClass('field-error');
} else {
$('#hero-fname')。parent('div')。removeClass('field-error');
}
if(email.length == 0 || email.indexOf('@')=='-1'){
var error = true;
$('#hero-email')。parent('div')。addClass('field-error');
} else {
$('#hero-email')。parent('div')。removeClass('field-error');
}
if(username.length == 0){
var error = true;
$('#hero-username')。parent('div')。addClass('field-error');
} else {
$('#hero-username')。parent('div')。removeClass('field-error');


if(error == true){
$('#hero-error-notification')。addClass('show-up');
} else {
$('#hero-error-notification')。removeClass('show-up');

$ b $ if(error == false){
$ .post(hero-form.php,$(#register-form)。serialize() ,函数(result){
if(result =='sent'){
$('#hero-success-notification')。addClass('show-up');
$ ('#hero-submit')。addClass('disabled');
}
});
}
});


//函数关闭通知
$('a.notification-close')。click(function(){
$(this).parent ('div')。fadeOut(200);
});

PHP:

 <?php 
$ subject ='在Urip登陆页面注册新帐户'; //您的电子邮件主题
$ to='adam@test.com'; //收件人或您的电子邮件
$ headers ='MIME-Version:1.0'。 \r\\\
;
$ headers。=From:。 $ _POST ['heroEmail']。 \r\\\
; //发件人的电子邮件
$ headers。='Content-type:text / html; charset = iso-8859-1'。 \r\\\
;
$ message。='账户信息:'。 <峰; br> 中;
$ message。='用户名:'。 $ _POST ['heroUsername']。 <峰; br> 中;
$ message。='名字:'。 $ _POST ['heroFname']。 <峰; br> 中;
$ message。='姓氏:'。 $ _POST ['heroLname']。 <峰; br> 中;
$ message。='电子邮件地址:'。 $ _POST ['heroEmail']。 <峰; br> 中;
$ message。='电话号码:'。 $ _POST [ heroPhone];
if(mail($ to,$ subject,$ message,$ headers)){
header('location:/page2.html');
}

else {
header('location:/page3.html');
}

?>

HTML

 < form class =register-form margin-top-32 margin-bot-5id =register-formmethod =post> 
< div class =row>

< div class =col-lg-6 col-md-6>
< div class =required-field>
< input name =heroFnameid =hero-fnameclass =hero-inputtype =textplaceholder =First Name>
< / div>
<! - /。必需字段 - >
< / div>

< div class =col-lg-6 col-md-6>
< input name =heroLnameid =hero-lnameclass =hero-inputtype =textplaceholder =Last Name>
< / div>

< div class =col-lg-12 col-md-12>
< div class =required-field>
< input name =heroUsernameid =hero-usernameclass =hero-inputtype =textplaceholder =Choose Username>
< / div>
<! - /。必需字段 - >
< / div>

< div class =col-lg-12 col-md-12>
< div class =required-field>
< input name =heroEmailid =hero-emailclass =hero-inputtype =textplaceholder =Email Address>
< / div>
<! - /。必需字段 - >
< / div>

< div class =col-lg-8 col-md-8>
< input name =heroPhoneid =hero-phoneclass =hero-inputtype =textplaceholder =Phone Number>
< / div>

< div class =col-lg-4 col-md-4>
< button id =hero-submittype =submitclass =submit-btn>创建< /按钮>
< / div>

< / div>
< / form>
<! - / .register-form - >


解决方案

问题在于您的php标头重定向:

  header(Location:$ redirect_thankyou); 

这会导致浏览器在您的ajax调用中加载重定向的页面:

  $。post(hero-form.php,$(#register-form)。serialize(),function(result){

因此 result 将包含页面的html内容你必须重定向到发送



您需要删除 header()在php中重定向,取而代之的是返回jQuery中的ajax调用期望的内容.Json会更适合这个,但是单个字符串也应该可以工作。 b $ b

I cant figure out why this wont redirect when everything looks in place.

I have used Location /path but just doesn't move from the main page.

Email sends and form is fine but cant get to redirect to thank you page or errors to show up.

Here is my code JS / PHP/ HTML below

Thanks in advance and hopefully you can spot something

JS:

/* ==================================
       Hero Form Validation
    =====================================*/
$('#hero-submit').click(function(e) {

  // Stop form submission & check the validation
  e.preventDefault();

  // Variable declaration
  var error = false;
  var fname = $('#hero-fname').val();
  var email = $('#hero-email').val();
  var username = $('#hero-username').val();

  // Form field validation
  if (fname.length == 0) {
    var error = true;
    $('#hero-fname').parent('div').addClass('field-error');
  } else {
    $('#hero-fname').parent('div').removeClass('field-error');
  }
  if (email.length == 0 || email.indexOf('@') == '-1') {
    var error = true;
    $('#hero-email').parent('div').addClass('field-error');
  } else {
    $('#hero-email').parent('div').removeClass('field-error');
  }
  if (username.length == 0) {
    var error = true;
    $('#hero-username').parent('div').addClass('field-error');
  } else {
    $('#hero-username').parent('div').removeClass('field-error');
  }

  if (error == true) {
    $('#hero-error-notification').addClass('show-up');
  } else {
    $('#hero-error-notification').removeClass('show-up');
  }

  if (error == false) {
    $.post("hero-form.php", $("#register-form").serialize(), function(result) {
      if (result == 'sent') {
        $('#hero-success-notification').addClass('show-up');
        $('#hero-submit').addClass('disabled');
      }
    });
  }
});


// Function to close the Notification
$('a.notification-close').click(function() {
  $(this).parent('div').fadeOut(200);
});

PHP:

<?php 
$subject='Register New Account on Urip Landing Page'; // Subject of your email
$to='adam@test.com'; //Recipient's or Your E-mail
$headers='MIME-Version: 1.0' . "\r\n";
$headers .="From: " . $_POST['heroEmail'] . "\r\n"; // Sender's E-mail
$headers .='Content-type: text/html; charset=iso-8859-1' . "\r\n";
$message .='ACCOUNT DETAILS: ' . "<br>";
$message .='Username: ' . $_POST['heroUsername'] . "<br>";
$message .='First Name: ' . $_POST['heroFname'] . "<br>";
$message .='Last Name: ' . $_POST['heroLname'] . "<br>";
$message .='Email Address: ' . $_POST['heroEmail'] . "<br>";
$message .='Phone Number: ' . $_POST['heroPhone'];
if (mail($to, $subject, $message, $headers)) {
  header('location: /page2.html');
}

else {
  header('location: /page3.html');
}

?>

HTML

<form class="register-form margin-top-32 margin-bot-5" id="register-form" method="post">
  <div class="row">

    <div class="col-lg-6 col-md-6">
      <div class="required-field">
        <input name="heroFname" id="hero-fname" class="hero-input" type="text" placeholder="First Name">
      </div>
      <!--/ .required-field -->
    </div>

    <div class="col-lg-6 col-md-6">
      <input name="heroLname" id="hero-lname" class="hero-input" type="text" placeholder="Last Name">
    </div>

    <div class="col-lg-12 col-md-12">
      <div class="required-field">
        <input name="heroUsername" id="hero-username" class="hero-input" type="text" placeholder="Choose Username">
      </div>
      <!--/ .required-field -->
    </div>

    <div class="col-lg-12 col-md-12">
      <div class="required-field">
        <input name="heroEmail" id="hero-email" class="hero-input" type="text" placeholder="Email Address">
      </div>
      <!--/ .required-field -->
    </div>

    <div class="col-lg-8 col-md-8">
      <input name="heroPhone" id="hero-phone" class="hero-input" type="text" placeholder="Phone Number">
    </div>

    <div class="col-lg-4 col-md-4">
      <button id="hero-submit" type="submit" class="submit-btn">Create</button>
    </div>

  </div>
</form>
<!--/ .register-form -->

解决方案

The problem is your php header redirect:

header("Location: $redirect_thankyou"); 

This causes the browser to load the redirected page in your ajax call:

$.post("hero-form.php", $("#register-form").serialize(),function(result){

So result will contain the html contents of the page you have redirect to and not just the word sent.

You need to remove the header() redirects in php and instead send the content back that your ajax call in jQuery is expecting. Json would be better suited for this, but a single string should work as well.

这篇关于在联系表单上重定向的问题的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆