Question

编辑：现在可以使用，代码已更新。非常感谢Martin Amps！

所以我现在已经玩了一个星期并且已经将很多例子共同攻击了但是它没有用，所以我不打扰发布代码因为它是一团糟！我是所有行业的杰克，没有人，所以我不确定我哪里出错了。

这就是我需要的。

posttest.php

<html>
<head>
<script type="text/javascript" src="./js/jquery-1.7.2.min.js"></script>
</head>
<body>

<form name="processForm" id="processForm" action="process.php" method="POST">
  <input type="text" id="textField" name="textField" />
  <input type="hidden" id="sessionID" name="sessionID" value="myusername" />
<input type="submit" value="Process!" />
</form>

<div id="mydiv"></div>

FILLER<BR><BR>FILLER<BR><BR>FILLER<BR><BR>FILLER<BR><BR>FILLER<BR><BR>FILLER<BR><BR>FILLER<BR><BR>FILLER<BR><BR>FILLER<BR><BR>FILLER<BR><BR>
FILLER<BR><BR>FILLER<BR><BR>FILLER<BR><BR>FILLER<BR><BR>FILLER<BR><BR>FILLER<BR><BR>FILLER<BR><BR>FILLER<BR><BR>FILLER<BR><BR>FILLER<BR><BR>

<script type="text/javascript">

$('#processForm').submit(function() {
  var text = $('#textField').val();
  var sid  = $('#sessionID').val();

$.ajax({
  url: "process.php",
  type: "POST",
  data: { 'text' : text, 'sessionID' : sid },
  success: function(data) {
    var result = $.parseJSON(data);
    if (result.success) {           
        // Handle your result and update your form accordingly  
        // result.data.someKey  
        $('#mydiv').text('Success! With ' + result.data);

    }
    else {
        // Error handling as applicable
    }
  }
});

    return false;
});

</script>

</body>
</html>

process.php

<?php
$someText=$_POST['text'];

$return = array('success' => false, 
            'data' => $someText
           );

if (isset($_POST['text'], $_POST['sessionID'])) {
    // Do your queries

    $return['success'] = true;
    //$return['data'] = array('someKey' => 'someValue');
    $return['data'] = $someText;
}

echo json_encode($return);
?>

我已经尝试了很多这样的例子，并试图从头开始制作我自己的例子，似乎无法让它发挥作用！我想要完成的一个例子就像你在Facebook上添加评论或新帖子一样。

我希望有人可以提供帮助，因为我觉得我已经浪费了一周这个简单的任务。

提前致谢！

Answer 1

您不需要在页面中存储会话变量，因为它已经存储在cookie中。假设您正在使用JQuery，这是一个快速示例：

标记

<form id="processForm" action="process.php" method="POST">
   <input type="text" id="textField" name="textField" />
   <input type="hidden" id="sessionID" name="sessionID" value="<?=session_id()?>" />
   <input type="submit" value="Process!" />
</form>

Javascript

$('#processForm').submit(function() {
  var text = $('#textField').val();
  var sid  = $('#sessionID').val();

  $.ajax({
    url: "process.php",
    type: "POST",
    data: { 'text' : text, 'sessionID' : sid },
    success: function(data) {
        var result = $.parseJSON(data);
        if (result.success) {           
            // Handle your result and update your form accordingly  
            // result.data.someKey  
        }
        else {
            // Error handling as applicable
        }
    }
   });

   return false;
});

<强> process.php

<?php

$return = array('success' => false, 
                'data' => array()
               );

if (isset($_POST['text'], $_POST['sessionID'])) {
    // Do your queries

    $return['success'] = true;
    $return['data'] = array('someKey' => 'someValue');
}

echo json_encode($return);
?>

注意

你应该使用绝对网址并注意表单/ javascript是非突兀的，所以你应该让它在没有ajax的情况下运行。

Answer 2

您可以只使用一般的AJAX请求，然后更改响应中的div吗？

这当然是使用JQuery。

$.ajax({
                    type: "POST",
                    url: "/process.php",    
                    data: "yourData=AwesomeData&SomeOtherData=5",
                    success: function(data){
                        //Update the div
                    },
                    error: function(request){
                        //Something went wrong.
                    },
                });

Answer 3

我假设您只想通过ajax从process.php加载一些数据。您可以使用jquery中的load()方法。 http://api.jquery.com/load/

在 index.php 文件中：

$('#container').load('process.php', {'variable1' : var1, 'variable2' : var2});

上面的代码用于使用POST请求通过ajax提交数据。所以你必须使用$_POST['variable1']在 process.php 文件中访问它们然后只是执行你的查询，我假设你已经如何做到这一点所以我不提供一个例子。如果是多行结果，则需要将结果存储在数组中：

$store = array();
foreach($result as $row){
  $store[] = array('field1'=>$row['field_name']);
}

最后使用json_encode使数组更容易在javascript中处理：

echo json_encode($store);

如果您需要更多帮助，请随时发表评论。

Answer 4

以下是收集用户数据的网络表单示例：

<form class="form">
<input class="name" type="text"/>
<input class="email" type="text"/>

<button class="submit">Send Data</button>
</form>

这是jQuery：

$('form button.submit').click(function() {
    $.ajax({
        'data' : $('form').serialize(),
        'type' : 'POST',
        'url' : 'process.php',
        'success' : function(data) {
            $('div.container').html('<p>' + data + '</p>');
        }
    });
});

这是PHP：

<?php
    if (isset($_POST['name']) && isset($_POST['email']) && $_POST['name'] != "" && $_POST['email'] != "") {
    //Do some SQL processing

        echo "success";
        exit;
    }

?>

希望有所帮助！

发布到PHP，不要重新加载页面和更新div

4 个答案: