一个JSON调用返回多个？

Question

我的问题是...如何使json有一个回调与几个对象。

我会用3个值的这个例子要返回......这里是calclickM.php文件，但我不明白为什么它不沃金...

<?php 
$choice = (isset($_POST['choice'])) ? date("Y-m-d",strtotime($_POST['choice'])) : date("Y-m-d"); 
$con = mysql_connect("localhost","root","xxxxxx"); 
if (!$con) { die('Could not connect: ' . mysql_error()); } 
mysql_select_db("inverters", $con); 

$sql = "SELECT sum(power/1000) AS choice FROM feed WHERE date = '".$choice."' group by date"; $res = mysql_query($sql) or die('sql='.$sql."\n".mysql_error()); 
$row = mysql_fetch_assoc($res); 
$dayPowerP = array ('dayPowerP'); 
?> 

<?php 
$choice = (isset($_POST['choice'])) ? date("m",strtotime($_POST['choice'])) : date("m"); $con = mysql_connect("localhost","root","xxxxxx"); 
if (!$con) { die('Could not connect: ' . mysql_error()); } 
mysql_select_db("inverters", $con); 
$sql = "SELECT sum(power/1000) AS choice FROM feed WHERE month(date) = '".$choice."'"; 
$res = mysql_query($sql) or die('sql='.$sql."\n".mysql_error()); 
$row = mysql_fetch_assoc($res); 
$monthPowerP = array ('monthPowerP'); 
?> 

<?php 
$choice = (isset($_POST['choice'])) ? date("Y",strtotime($_POST['choice'])) : date("Y"); $con = mysql_connect("localhost","root","xxxxxx"); 
if (!$con) { die('Could not connect: ' . mysql_error()); } 
mysql_select_db("inverters", $con); 

$sql = "SELECT sum(power/1000) AS choice FROM feed WHERE year(date) = '".$choice."'"; 
$res = mysql_query($sql) or die('sql='.$sql."\n".mysql_error()); 
$row = mysql_fetch_assoc($res); 
$yearPowerP = array ('yearPowerP'); 
?> 
<?php 
$outarr['dayPowerP'] = $dayPowerP; 
$outarr['monthPowerP'] = $monthPowerP; 
$outarr['yearPowerP'] = $yearPowerP; 
echo json_encode($outarr); 
?> 

这里是Jquery的我使用的发布和JSON

<script type="text/javascript"> 
$(document).ready(function() { 
$('#datepicker').datepicker({maxDate: 0, dateFormat: 'yy-mm-dd', onSelect: function(dateText) { 
      var myDate = $(this).datepicker('getDate'); 
      $('#apDiv1').html($.datepicker.formatDate('DD, d', myDate)); 
      $('#apDiv5').html($.datepicker.formatDate('MM', myDate)); 
      $('#apDiv7').html($.datepicker.formatDate('yy', myDate));   
      $.ajax({ 
      type: "POST", 
      url: "calclickM.php",     
      data: {choice: dateText}, 
      dataType: "json", 
      success: function(json_data) { 
      $('#apDiv2').html(json_data['dayPowerP']); 
      $('#apDiv6').html(json_data['monthPowerP']); 
      $('#apDiv8').html(json_data['yearPowerP']); 
      } 
     })   
    }}); 
}); 

感谢，

艾伦

Answer 1

不是soluti直接解决你的问题，但是你的代码需要一些严肃的重构。这里重复的程度伤害了我的眼睛。第二个代码块中，一个与Ajax的电话，可能被更改为这样的事：

var pages = [ 
    { url: "dayPower.php", div: "#apDiv4" }, 
    { url: "dayGraph",  div: "#apDiv2" }, 
    { url: "monthPower.php", div: "#apDiv6" }, 
    { url: "monthGraph",  div: "#apDiv9" }, 
    { url: "yearPower.php", div: "#apDiv8" }, 
    { url: "yearPower",  div: "#apDiv10" } 
}; 

for (var i=0; i<pages.length; i++) { 
    $.ajax({ 
    type: "POST", 
    url: pages[i].url,     
    data: { choice: dateText}, 
    dataType: "json", 
    success: function(json_data) 
     (pages[i].div).html(data).show(); // Did you mean json_data here? 
    } 
    }); 
} 

的情况是在你的问题的第一块代码相似。

再一次，我知道它不会解决实际问题，但它会使您更容易在您（或其他人）发现它时实施解决方案。

编辑

关于第二个想法，我至少可以看到一个奇怪的事情：在成功的函数调用的参数json_data，但你访问你打过电话data变量。你打算给他们起同样的名字吗？

Answer 2

首先，您要调用的load方法正在向您的服务器发出AJAX GET请求。您可能在PHP脚本中同时支持POST和GET请求。

其次，您的$.ajax调用中有一些错误。有一些未终结的字符串，您正在使用的数据变量('#apDiv9').html(data)未定义，如果是，它可能包含JSON数据，您无法直接将其放入HTML元素中。

最后但并非最不重要的是，第二次尝试不会让您的代码更快。浏览器只能支持有限数量的并行ajax请求（1-2）。您仍然提出相同数量的请求，其中一些需要等待其他人完成。重新设计代码，以便在一次调用中返回所有内容。

Answer 3

我不完全相信你问什么，但这里有几个要点：

1. $('#apDiv2').load('dayPower.php', {choice: dateText}做同样的事情$.ajax({type: "POST", url: "dayPower.php", data: { choice: dateText}。 $.ajax和$.load均通过JavaScript发出HTTP请求，这就是“AJAX”的含义。

2. 你的第二块示例代码有一些基本的语法错误。这是第一个$就调用更正：

   $.ajax({ 
       type: "POST", 
       url: "dayPower.php",     
       data: { choice: dateText}, 
       dataType: "json", 
       success: function(json_data) { // “{” added to start the function block 
        ('#apDiv2').html(data).show(); 
       } 
   }) // “})” added to end the object literal and function call 
   

Answer 4

有一种方法可以做到你的要求，但你需要自己处理的结果。基本上所有的Ajax调用都有相同的参数，但结果集不同。因此，首先，客户端的代码，不会魔法：

$.post('datePacked.php', {choice: dateText}, function(data) { 
    $('#apDiv2').html(data['dayPower']); 
    $('#apDiv4').html(data['dayGraph']); 
    $('#apDiv6').html(data['monthPower']); 
    $('#apDiv9').html(data['monthGraph']); 
    $('#apDiv8').html(data['yearPower']); 
    $('#apDiv10').html(data['yearGraph']); 
}); 

如果你重构你的HTML所以taht你居然div编号与你的JSON响应的结果，可以简化呼叫进一步匹配：

$.post('datePacked.php', {choice: dateText}, function(data) { 
    $.each(data, function(id, value) { 
     $('#'+id).html(value); 
    }); 
}); 

在服务器端，您的新datePacked.php需要返回JSON结果，该结果为内容提供名称散列。本质上它看起来是这样的：

{ "dayPower" : "<p>My Content</p>", "dayGraph" : "<p>Day graph</p>", ... } 

省略号在那里供您填写剩余的内容。为你的HTML元素选择有意义的id名不仅是好的做法，如果你利用它，它可以为你节省大量的重复。一个例子就是客户端示例的第二种形式。在内容必须是JSON才能正常工作的情况下 - 除非你想分离服务器返回的DOM。

Answer 5

如果你不需要单独调用任何这些，为什么不只需要调用一个ajax调用一个php文件，将所有的数据打包到一个多维数组中，转换成json并发送回客户端。

一旦你有了这个json，你可以用js分解它，并找出你的前端的位置。

取决于您获得的数据量可能需要一段时间。如果这是一个巨大的查询，那么将其分解为几个小的调用实际上会更好。它的异步，所以至少你的页面的一部分将被加载。而其他部分正在收集数据。