关于javascript:AJAX – 将数据发送到我的php文件似乎不起作用

AJAX - Sending data to my php file does not seem to work

本问题已经有最佳答案,请猛点这里访问。

我对jquery、ajax和php还是个新手。

我在想我在这里可能做错了什么。我正在接收有关客户的信息,并尝试在同一页上返回确认消息。

所以我面临的问题是:1)单击提交按钮刷新我的页面?为什么?

2)我的提交按钮下面有一个。我怎样才能用addcustomer.php的结果更改它的文本呢?

3)是否可以将我的javascript和php代码放在customer.php下的同一个文件中?

编辑:我也在使用火狐的篡改数据插件-当我单击提交时,由于某种原因没有发送数据。

客户机

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
<script type="text/javascript">

$(document).ready(function(){
    $('#submit').click(function() {
        $.ajax({
            type : 'POST',
            url : 'addCustomer.php',
            dataType : 'json',
            data:{
                add_LN : $('#add_LN').val(),
                add_FN : $('#add_FN').val(),
                add_PN : $('#add_PN').val(),
                add_DOB : $('#add_DOB').val()
            },
            success : function(data){
                //I want to change the"confirmMsg" to the string given back from addCustomer.php
            }
        }
    }
}



<p>
&nbsp;
</p>
<p>
Add New Customer:
</p>

<form>
  <table width="396" border="1">
    <tr>
      <td width="133"><p>
Last Name:
</p>
      <p>
First Name:
</p>
      <p>
Phone Number:
</p>
      <p>
Date of Birth:
</p></td>
      <td width="144"><p>

        <input type="text" name="add_LN" id="add_LN" />
       
</p>
      <p>

        <input type="text" name="add_FN" id="add_FN" />
       
</p>
      <p>

        <input type="text" name="add_PN" id="add_PN" />
       
</p>
      <p>

        <input type="text" name="add_DOB" id="add_DOB" />
     
</p>        </td>
      <td width="97"><input type="submit" name="submit" id="submit" value="Add Customer" /></td>
     
        </tr>
      </table>
    </form>
 
<p>
&nbsp;
</p>

Advutual.PHP

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
<?php
$username="******";
$password="******";
$database="******";

if (isset ($_POST['add_LN']))
    $lastName=$_POST['add_LN'];
else
    die("Last Name not passed in POST");

if (isset ($_POST['add_FN']))
    $firstName=$_POST['add_FN'];
else
    die ("First Name not passed in POST");

if (isset ( $_POST['add_PN']))
    $phone=$_POST['add_PN'];
else
    die("Phone Number not passed in POST");

if (isset ($_POST['add_DOB']))
    $dob=$_POST['add_DOB'];
else
    die("Date of Birth not passed in Post");

//$membership==$_POST['membership'];

mysql_connect("dbs4.cpsc.u.ca",$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();
?>

非常感谢你的帮助!


好的,按顺序回答您的问题:

  • 您应该能够从Firebug中进行检查(您使用的是Firebug,对吗?)在控制台选项卡中查看addcustomer.php是Ajax请求调用的端点。如果失败,可以将以下代码添加到脚本中:

    1
    2
    3
    $('#confirmMsg').ajaxComplete(function(e, xhr, settings) {
        $(this).text('The response from your page is ' + xhr.responseHTML);
    });
  • 我假设您的问题是"我的提交按钮下有一个分区…"。尝试以下命令(这是完整Ajax方法的缩短版本):

    1
    2
    3
    4
    5
    6
    7
    8
    $.post('addCustomer.php', {
        add_LN : $('#add_LN').val(),
        add_FN : $('#add_FN').val(),
        add_PN : $('#add_PN').val(),
        add_DOB : $('#add_DOB').val()
    }, function(data){
        $('#confirmMsg').text(data);
    });
  • 最后,是的-可以将脚本和PHP代码放在同一页上。PHP代码在呈现到浏览器之前在服务器上执行,而JavaScript在客户端工作,在页面交付后执行。