从Javascript OnClick调用PHP页面时AJAX返回错误

时间:2012-04-16 04:12:46

标签: php javascript html ajax json

我的解决方案是使用onClick事件调用PHP页面,发布参数并使用AJAX返回结果。我在使用指定的URL调用PHP页面时插入参数。 这是我的Javascript:

function uploadContact() {
        var name, email, phone, badgeid;
        if(window.localStorage.length > 0)
        {
            name = window.localStorage.getItem('name');
            email = window.localStorage.getItem('email');
            phone = window.localStorage.getItem('phone');
        }
        else
        {
            name = $('input[name=fullname]').val();
            email = $('input[name=email]').val();
            phone = $('input[name=phone]').val();
        }
        $.ajax({
             url: 'UpdateContactList.php?name=' + name + '&email=' + email + '&phone=' + phone,
             type: $form.attr('method'),
             dataType: 'json',
             success: function(responseJson) {
             $form.before("<p>"+responseJson.message+"</p>");
        },
        error: function() {
            $form.before("<p>There was an error processing your request.</p>");
        }});
    }

我的PHP代码获取参数:

<?php

$response = array();

if($_SERVER['REQUEST_METHOD'] == 'POST')
{
  // if form has been posted process data

  // you dont need the addContact function you jsut need to put it in a new array
  // and it doesnt make sense in this context so jsut do it here
  // then used json_decode and json_decode to read/save your json in
  // saveContact()
   $data = array( 'fullname' => $_POST['name'], 'email' => $_POST['email'], 'phone' => $_POST['phone']);
      //These line is for testing only, remove it when done testing
   $test = $_POST['name'] . ' ' . $_POST['email'];
   echo "<script>alert('$test');</script>";
  // always return true if you save the contact data ok or false if it fails
   $response['status'] = updateContact($data) ? 'success' : 'error';
   $response['message'] = $response['status']
          ? 'Your submission has been saved!'
          : 'There was a problem saving your submission.';

   header("Content-type: application/json");
   echo json_encode($response);
   exit;
}
...
 function updateCacheFile($filename)
{
    $filename = "contact";
    $filename =  $filename . ".appcache";
    $cachefile = fopen ($filename, "a+");
    ....
    file_put_contents($filename, $cache_content);
}

请注意2个问题:

  1. 我可以使用浏览地址链接中的参数直接调用PHP页面,这样做什么都不会返回。通常是吗?

  2. 从javascript调用。测试行(调用警报消息框)将不起作用,不会显示任何消息。但缓存文件仍然更新,这意味着调用PHP页面并执行诸如编写文件之类的操作。

  3. 此PHP页面中有2个文件要写入。它们都写得正确,但参数不会显示,也没有显示消息框。

    请告诉我这里出了什么问题。

    P / S:小细节,带空格的参数是否可以正确传递?因为我希望用户输入他们的全名,例如'Bill Jobs'。

    感谢Stackoverflow社区。

3 个答案:

答案 0 :(得分:2)

   echo "<script>alert('$test');</script>";
  // always return true if you save the contact data ok or false if it fails
   $response['status'] = updateContact($data) ? 'success' : 'error';
   $response['message'] = $response['status']
          ? 'Your submission has been saved!'
          : 'There was a problem saving your submission.';

   header("Content-type: application/json");
   echo json_encode($response);

在开始header或以其他方式刷新输出之前,必须执行所有echo s。

   header("Content-type: application/json");
   echo "<script>alert('$test');</script>";
  // always return true if you save the contact data ok or false if it fails
   $response['status'] = updateContact($data) ? 'success' : 'error';
   $response['message'] = $response['status']
          ? 'Your submission has been saved!'
          : 'There was a problem saving your submission.';

   echo json_encode($response);

答案 1 :(得分:2)

$.ajax({
         url: 'UpdateContactList.php',
         data:{'name':name,'email': email,'phone':phone,'badgeid ':badgeid },
         type: $form.attr('method'),
         dataType: 'json',
         success: function(responseJson) {
         $form.before("<p>"+responseJson.message+"</p>");
    },
    error: function() {
        $form.before("<p>There was an error processing your request.</p>");
    }});

答案 2 :(得分:1)

尝试在ajax的数据参数中发送您的信息,并将类型设置为发布。像这样......

$.ajax({
         url: 'UpdateContactList.php',
         type: 'post',
         dataType: 'json',
         data: {'key1': value1, 'key2':value2},
         success: function(responseJson) {
         $form.before("<p>"+responseJson.message+"</p>");
    },