php - 我已将信息插入我的数据库中，并且我也已验证它。但如果我点击插入它会重定向到另一个页面

Question

我已将信息插入我的数据库中，并且我也已验证它。但如果我点击插入它会重定向到另一个页面。我想用 AJAX 概念完成此操作，请帮助我。提前致谢

HTML 编码

<form id="myform" action="bl/checkout_report.php?action=check_out" method="post" name="myform">
  <table width="200" border="0">
     &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;  <h3><u><b>Shipping Details</b></u></h3>
   <tr>
  <th scope="row"><label>Name*</label></th>
  <td><input id="fname" name="fname" type="text" class="shipping-required"></td>
</tr>
 <tr>
 <th scope="row"><label>Shipping Address*</label>;</th>
 <td><textarea name="address" id="address" class="shipping-required"></textarea></td>
 </tr>
 <tr>
<th scope="row"><label>Nearest Landmark*</label></th>
<td><textarea name="land" id="land" class="shipping-required"></textarea></td>
</tr>
 <tr>
<th scope="row"><label>City*</label></th>
<td><input id="city" name="city" type="text" class="shipping-required"></td>
 </tr>
 <tr>
 <th scope="row"><label>State*</label></th>
  <td><select id="state" name="state"> <option selected="" value="Default" class="shipping- required">(Please select a state)</option>  
 <option>Andhara Pradesh</option>
 <option>Assam</option>
 <option>Bihar</option>
 <option>Delhi</option>
 <option>Gujarat</option>
 <option>Tamil Nadu</option>
  </select></td> 
   </tr>
   <tr>
    <th scope="row"><label>Pin Code*</label></th>
   <td><input id="code" name="code" type="text" class="shipping-required"></td>
  </tr>
  <tr>
  <th scope="row"><label>Mobile Number*</label></th>
  <td><input id="mobile1" name="mobile1" type="text" class="shipping-required"></td>
   </tr>
  <tr>
   <th scope="row"> <label>Mail id</label></th>
   <td><input id="mail1" name="mail1" type="text" class="shipping-required"></td>
  </tr>
  <td><input type="hidden" id="pwd" name="pwd" value="<?php echo "$password"?>"></td> 
 <tr>
 <td><input id="submit" name="submit" type="submit" value=" Continue" onclick="return  formValidate()"></td>
  </tr>
 </table>
 </form>

JAVASCRIPT验证函数

function formValidate() {
  alert("ok");
  var fname = document.myform.fname;
  var address = document.myform.address;
  var land = document.myform.land;
  var city = document.myform.city;
  var state = document.myform.state;
  var code = document.myform.code;
  var mobile1 = document.myform.mobile1;
  var mail1 = document.myform.mail1;
  if (item1(fname)) {
    if (idd(address)) {
      if (lad(land)) {
        if (place(city)) {
          if (native(state)) {
            if (pin(code)) {
              if (number(mobile1)) {
                if (id(mail1)) {
                  document.myform.submit();
                }
              }
            }
          }
        }
      }
    }
  }
  return false;
}

function item1(fname) {
  if (fname.value != "") {
    var letters = /^[A-Z a-z]+$/;
    if (fname.value.match(letters)) {
      return true;
    } else {
      alert('nbumber');
      fname.focus();
      return false;
    }
  } else {
    alert(' Name should not empty');
    fname.focus();
  }
}

function idd(address) {
  if (address.value != "") {
    var letters = /^[a-zA-Z0-9\s,'-]*$/;
    if (address.value.match(letters)) {
      return true;
    } else {
      alert('Enter Valid Address ');
      address.focus();
      return false;
    }
  } else {
    alert('Address should not empty');
    address.focus();
  }
}

function lad(land) {
  if (land.value != "") {
    var letters = /^[a-zA-Z0-9\s,'-]*$/;
    if (land.value.match(letters)) {
      return true;
    } else {
      alert('Enter Valid Land Mark ');
      land.focus();
      return false;
    }
  } else {
    alert('Land Mark should not empty');
    land.focus();
  }
}

function place(city) {
  if (city.value != "") {
    var letters = /^[A-Z a-z]+$/;
    if (city.value.match(letters)) {
      return true;
    } else {
      alert(" City Must have alphabet Charater Only");
      city.focus();
      return false;
    }
  } else {
    alert('city should not empty');
  }
}

function native(state) {
  if (state.value == "Default") {
    alert('Select your State from the list');
    state.focus();
    return false;
  } else {
    return true;
  }
}

function pin(code) {
  if (code.value != "") {
    var uadd_len = code.value.length;
    if (uadd_len == 6) {
      return true;
    } else {
      alert(" Pin Code Must Have six Numbers");
      code.focus();
      return false;
    }
  } else {
    alert('Pincode should not empty');
  }
}

function number(mobile1) {
  if (mobile1.value != "") {
    var uadd_len = mobile1.value.length;
    if (uadd_len == 10) {
      return true;
    } else {
      alert('Enter 10 Digit Mobile Number ');
      mobile1.focus();
      return false;
    }
  } else {
    alert('Mobile Number should not empty');
    mobile1.focus();
  }
}

function id(mail1) {
  if (mail1.value != "") {
    var mailformat = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/;
    if (mail1.value.match(mailformat)) {
      return true;
    } else {
      alert('Invalid Mail Format ');
      mail.focus();
      return false;
    }
  } else {
    alert('Mail should not empty');
    mail1.focus();
  }
}

Answer 1

您可以编写自己的 Ajax 脚本 XHR Create 对象或使用现有的库(如 jQuery)来简化您的工作

http://api.jquery.com/jQuery.post/

$("#foo").submit(function(event){
  var request = $.ajax({
    url: "/checkout_report.php",
    type: "post",
    data: serializedData
  });
});

检查 stackoverflow 中现有的 ex:jQuery Ajax POST example with PHP