Question

我在填写表单并按提交以将我的信息发送到数据库时遇到问题。问题是，即使我使用AJAX保持在同一页面并在“show_label”中收到回复，我的页面也会刷新。

我已经测试过是否通过更改show_label来调用addCustomerFunc，它确实发生了变化！但仍然刷新，我刷新后丢失了消息。我希望有人能抓住我的错误。

这是我的customer.php

<script type="text/javascript">

function addCustomerFunc(add_LN,add_FN,add_PN,add_DOB)
{
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }

xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("show_label").innerHTML=xmlhttp.responseText;
    }
  }

xmlhttp.open("POST","addCustomer.php",true);
xmlhttp.send("add_LN="+add_LN+"&add_FN="+add_FN+"&add_PN="+add_PN+"&add_DOB="+add_DOB);
}
</script>

    <p>Add New Customer:</p>
    <div align="center">
      <table width="337" border="1">
        <tr>
          <td width="154"><p>Last Name:</p>
          <p>First Name:</p>
          <p>Phone Number:</p>
          <p>Date of Birth:</p>
          <p>&nbsp;</p></td>
          <td width="167"><p align="center">
            <form>
                <input type="text" name="add_LN" id="add_LN" />
                <br/><br/>
                <input type="text" name="add_FN" id="add_FN" />
                <br /><br />
                <input type="text" name="add_PN" id="add_PN" />
                <br /><br />
                <input type="text" name="add_DOB" id="add_DOB" />
                <br /><br />
                <input type="submit" name="add_Customer" id="New_Customer_Form" value="Add Customer" onClick="addCustomerFunc(add_LN, add_FN, add_PN, add_DOB)"/>
            </form>
            <div id="show_label"/>
          </p>
          </td>
        </tr>
      </table>
      </div>

addCustomer.php

<?php
$username="****";
$password="****";
$database="****";

$lastName=$_POST['add_LN'];
$firstName=$_POST['add_FN'];
$phone=$_POST['add_PN'];
$dob=$_POST['add_DOB'];
//$membership==$_POST['membership'];

mysql_connect("******",$username,$password);

@mysql_select_db($database) or die( "Unable to select database");


$query = "INSERT INTO customer (last_name, first_name, phone_no, date_of_birth, membership) VALUES ('$lastName', '$firstName', '$phone', '$dob', 'T')";

if (mysql_query($query)){
    echo "Thanks";
} else 
{
    echo "Failed to insert customer into database";
}

mysql_close();

＆GT;

另外，我是否在addCustomerFunc中正确传递变量？我正确使用“发布”吗？

谢谢！

编辑：我现在遇到传递变量的问题，因为它说：未定义的索引：在C：\ Users \ ej \ Desktop \ cpsc471 \ presentation \ addCustomer.php中添加_LN 它虽然为我的数据库添加了空白。

Answer 1

由于您使用的是表单，因此需要确保在允许继续并刷新页面之前捕获submit事件。

这应该可以解决问题。（注意return false）

<input type="submit" name="add_Customer" id="New_Customer_Form" value="Add Customer" onClick="addCustomerFunc(add_LN, add_FN, add_PN, add_DOB); return false;"/>

Answer 2

更改按钮的类型：

submit至button

这样你就停留在1页，刷新就会消失： - ）

Answer 3

为什么不使用jQuery $.post()或$.get()？

顺便说一下，使用：

<input type="button" name="add_Customer" id="New_Customer_Form" value="Add Customer" onClick="addCustomerFunc(add_LN, add_FN, add_PN, add_DOB)"/>

而不是：

<input type="submit" name="add_Customer" id="New_Customer_Form" value="Add Customer" onClick="addCustomerFunc(add_LN, add_FN, add_PN, add_DOB)"/>

使用AJAX获取响应 - 但页面仍然令人耳目一新

3 个答案: