如何使用jqueryAJAX从页面中回调多个变量


How to callback several variables from a page using jquery AJAX

我在这个问题上花了几个小时(也许几天)。我知道以前有人问过这个问题,但答案总是很模糊,我的初学者经验水平很难理解。我喜欢一些具体和简化的代码示例。

我正在向changeDate.php提交一个AJAX调用。

index.html

$(document).on("click", "#day-left", function(event){
    changeDate = changeDate - 1;
    $.ajax({
            type: "POST",
            url: "changeDate.php",
            data: {
                amount: changeDate,
                loginName: "benjamin_lawson"
            },
            success: function(data) {
            $("#date").html(data);
            }
        });
    });

此页面接收ajax。它使用数据更新SQL并创建24个包含数据的变量($hour1、$hour2、$hour3…)。

changeDate.php

<?php
$amount = $_POST['amount'];
$user = $_POST['loginName'];
//server information variables
$dateName = date("mdY", strtotime("+" . $amount . " day"));

$conn = new mysqli($servername, $username, $password, $dbname);
for ($x = 1; $x <= 24; $x++) {
    $sql = "SELECT `$dateName` FROM `$user` WHERE hour='$x'";
    $result = $conn->query($sql);
    if ($result->num_rows > 0) {
         while($row = $result->fetch_assoc()) {
             ${"hour" . $x} = $row[$dateName];
         }
    }
    }
//this creates 24 variables with all my information I want sent 
//through my call back. ($hour1, $hour2, $hour3,...)

如何在保留变量名称和变量数据的回调中将这些变量传递回第一页?

我看到了一个与此相关的问题,他们回答道:

相关问题和答案。。。潜在解决方案

您可以使用json_encode()返回任意多个变量。

试试你的PHP:

<?php
echo json_encode(array($num1, $num2));
?>
You can add to that array , $num3, $num4, ... and so on.

在JS中,您可以按如下方式访问每个数字。

首先,在>>您的成功函数中,您将需要这行代码来解析编码的JSON字符串。

var result=$.parseJSON(输出);

将结果设置为JSON对象。现在您可以访问>result:中的所有字段

result[0]--PHP中的$num1result[1]--PHP 中的$num2

如果有人能在代码中向我展示我需要做些什么来实现这一点,我将不胜感激。非常感谢!

每个答案都告诉我们要使用php的JSON编码。你需要另一个答案,尽管已经有一个问题了。

从php,您可以返回任何您想要的数据。您可以提供一个字符串,也可以直接提供HTML或一些格式化的数据,如xml或JSON。

无论从该请求中得到什么回应/打印出来,都是一种回应。您可以直接从URL或AJAX进行请求。如果请求满足先决条件,它将显示相同的响应。

现在,如果你只回显任何数据,JS就没有结构,你可能必须格式化和解析它,才能从中提取有意义的数据

但是JSON和XML是已知的数据传输语言。XML很好,但需要在服务器端进行结构化,在客户端进行基于元素的检索(可能有很多高效的方法,我对此一无所知;因为我不喜欢XML)。对于JSON,您在服务器端有编码和解码方法,JavaScript就像它的哥哥

现在如何形成JSON?您只需将数组或对象传递给json_encode,它就会返回JSON字符串。echo那个字符串,您的响应就准备好了。

因此,我将使用@Poonam的代码;我也在做一些优化:

$amount = $_POST['amount'];
$user = $_POST['loginName'];
//server information variables
$dateName = date("mdY", strtotime("+" . $amount . " day"));
$conn = new mysqli($servername, $username, $password, $dbname);
for ($x = 1; $x <= 24; $x++) {
}
// fill an array from 1 to 24 with steps of 1
// http://php.net/manual/en/function.range.php
$x = range(1, 24, 1);
$sql = "SELECT `$dateName`, hour FROM `$user` WHERE hour IN ('". implode( "', '", $x ) ."')";
$result = $conn->query($sql);
$response_arr = array();
if ($result->num_rows > 0) {
     while($row = $result->fetch_assoc()) {
         $response_arr['hour' . $row->hour] = $row[$dateName];
     }
}
echo json_encode($response_arr);
exit(0);
//this creates 24 variables with all my information I want sent

在AJAX的成功回调中,如果内容类型没有提到为application/json,则使用JSON.parse()

这里我使用json对数据进行编码。

 $.ajax({
        type:"POST",
        async: false,
        url:"finance/getdataq",
        dataType: "json",
        data: data,      
        success: function(data){
// you can access your data variables like data['ukeydt'];
         $("."+targetval).find('.qrwordfol').html(data['ukeydt']);
         $("."+targetval).find('img').attr('src',data['ukeyqr']); 
         $("."+targetval).show();
         return false;  
        },
        error: function (data) {
            getd="";
        }
    });

在我的php代码中

    public function getdataq()
     {
      $data = array();
     $data['ukeydt'] = "this is first";
     $data['ukeyqr'] = "this is second";
     echo json_encode($data);
     exit(); 
    }

您可以使用一个数组,该数组将具有小时的所有值。

在changeDate.php 中

    $amount = $_POST['amount'];
$user = $_POST['loginName'];
//server information variables
$dateName = date("mdY", strtotime("+" . $amount . " day"));

$conn = new mysqli($servername, $username, $password, $dbname);
for ($x = 1; $x <= 24; $x++) {
    $sql = "SELECT `$dateName` FROM `$user` WHERE hour='$x'";
    $result = $conn->query($sql);
    $response_arr = array();
    if ($result->num_rows > 0) {
         while($row = $result->fetch_assoc()) {
             $response_arr['hour' . $x] = $row[$dateName];
         }
    }
    }

echo json_encode($response_arr);
     exit();
    //this creates 24 variables with all my information I want sent 
    //through my call back. ($hour1, $hour2, $hour3,...)

$response_arr将具有$response_arr['hour1']...$response_arr['hour24'],您可以在success: function(data) 中使用此阵列

success: function(data) {
        console.log(data);
        }

您将在data 中获得全部数据