Fatal编程技术网
  • php/
  • 使用Ajax的PHP数组-获取数据的正确方法？

使用Ajax的PHP数组-获取数据的正确方法？

php jquery mysql ajax json

使用Ajax的PHP数组-获取数据的正确方法？,php,jquery,mysql,ajax,json,Php,Jquery,Mysql,Ajax,Json,我是一个十足的ajax/php白痴——让我们现在就把它忘掉；但我已经到了需要帮助的地步。我一直在关注各种各样的教程，并整理了一份报告 最终，我有了一个包含我需要的所有数据的表。我可以获得这些数据，并将其适当地显示在表中，而不会出现问题。我正在尝试添加允许根据条件进行筛选的“下拉”框（此表中有一个名为“垂直”的列-因此下拉列表将包含数据库列中所有不同的“垂直”框-并根据选择的垂直项筛选表） 我有以下名为“client.php”的前端代码段，客户端加载该代码段以获取报告： Client.php： &

我是一个十足的ajax/php白痴——让我们现在就把它忘掉；但我已经到了需要帮助的地步。我一直在关注各种各样的教程，并整理了一份报告

最终，我有了一个包含我需要的所有数据的表。我可以获得这些数据，并将其适当地显示在表中，而不会出现问题。我正在尝试添加允许根据条件进行筛选的“下拉”框（此表中有一个名为“垂直”的列-因此下拉列表将包含数据库列中所有不同的“垂直”框-并根据选择的垂直项筛选表）

我有以下名为“client.php”的前端代码段，客户端加载该代码段以获取报告：

Client.php：

<head>
 <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 <link rel="stylesheet" type="text/css" href="css/mediacallreport.css">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Generic Title</title>
</head>



<body>
  <h2> Generic Reports </h2>
  <h3>Report Formatting: </h3>
  <div id="instruction">Select how you would like the data selected using the dropdowns below</div>

  <!--DROPDOWNS-->
 Vertical - 
<select name="station" id="station">
    <option value="all">All</option>
    <script id="source" language="javascript" type="text/javascript">
      $(function () 
      {
        $.ajax({                                      
          url: 'api.php',   //the script to call to get data          
          data: "",   //you can insert url argumnets here to pass to api.php
          dataType: 'json',   //data format      
          success: function(verticals) //on recieve of reply
          {
          for (var i in verticals)
          {
            var vertical = verticals[i];
            var verticalID = verticals[0];

        $('station').append("<option value=\""+verticalID+"\">"+verticalID+"</option>");
                }

          } 
        });
      });
    </script>
</select>

 <!--TABLE BEGINNING - TABLE HEADER ROW--> 
<table id="output">
<tr>
<th>ID</th>
<th>Station_Network</th>
<th>Vertical</th>
<th>Creative</th>
<th>Tolls</th>
<th>States</th>
<th>Date Range</th>
<th>Week</th>
<th>Ordered</th>
<th>Credits</th>
<th>Credits Totals</th>
<th>Not Used</th>
<th>Cleared</th>
<th>Total Uniques</th>
<th>Cleared Each Unique</th>
<th>Total Unique Connect</th>
<th>Cleared Each Unique Connect</th>
<th>Unique Connect 8am - 8pm</th>
<th>Cleared Unique 8am - 8pm</th>
<th>Calls over 10 Min</th>
<th>Calls over 10 Min %</th>
</tr>

<!--JAVASCRIPT TO GET INFORMATION FROM DB, ASSIGN VARIABLES AND PUT INTO TABLE ROWS-->
  <script id="source" language="javascript" type="text/javascript">
  $(function () 
  {
    //-----------------------------------------------------------------------
    // 2) SEND HTTP REQUEST WITH AJAX
    //-----------------------------------------------------------------------
    $.ajax({                                      
      url: 'api.php',   //the script to call to get data          
      data: "",   //you can insert url argumnets here to pass to api.php
                        //for example "id=5&parent=6"
      dataType: 'json',   //data format      
      success: function(rows) //on recieve of reply
      {
      for (var i in rows)
      {
        var row = rows[i];
        var id = row[0];              //get id
        var station_network = row[1];       //get name
        var vertical = row[2];  //get vertical
        var creative = row[3]; //get creative
        var tolls= row[4];  //get tolls
        var states= row[5];  //get states
        var date_range= row[6];  //get date_range
        var week= row[7];  //get week
        var ordered= row[8];  //get ordered
        var credits= row[9];  //get credits
        var credit_totals= row[10];  //get credit_totals
        var not_used= row[11];
        var cleared= row[12];
        var total_uniques= row[13];
        var cleared_each_unique= row[14];
        var total_unique_connect= row[15];
        var cleared_each_unique_connect= row[16];
        var unique_connect_8am_to_8pm= row[17];
        var cleared_each_8am_to_8pm= row[18];
        var calls_over_10= row[19];
        var calls_over_10_pct= row[20];
        //--------------------------------------------------------------------
        // DISPLAY THE CONTENT
        //--------------------------------------------------------------------
        //TABLES (ALTERNATING ROWS)
        if (id % 2 == 0){
        $('#output').append("<tr id=\"evenrow\"> <td>"+id+"</td><td>"+station_network+"</td><td>"+vertical+"</td><td>"+creative+"</td><td>"+tolls+"</td><td>"+states+"</td><td>"+date_range+"</td><td>"+week+"</td><td>"+ordered+"</td><td>"+credits+"</td><td>"+credit_totals+"</td><td>"+not_used+"</td><td>"+cleared+"</td><td>"+total_uniques+"</td><td>"+cleared_each_unique+"</td><td>"+total_unique_connect+"</td><td>"+cleared_each_unique_connect+"</td><td>"+unique_connect_8am_to_8pm+"</td><td>"+cleared_each_8am_to_8pm+"</td><td>"+calls_over_10+"</td><td>"+calls_over_10_pct+"</td></tr>");
        } else {
        $('#output').append("<tr id=\"oddrow\"> <td>"+id+"</td><td>"+station_network+"</td><td>"+vertical+"</td><td>"+creative+"</td><td>"+tolls+"</td><td>"+states+"</td><td>"+date_range+"</td><td>"+week+"</td><td>"+ordered+"</td><td>"+credits+"</td><td>"+credit_totals+"</td><td>"+not_used+"</td><td>"+cleared+"</td><td>"+total_uniques+"</td><td>"+cleared_each_unique+"</td><td>"+total_unique_connect+"</td><td>"+cleared_each_unique_connect+"</td><td>"+unique_connect_8am_to_8pm+"</td><td>"+cleared_each_8am_to_8pm+"</td><td>"+calls_over_10+"</td><td>"+calls_over_10_pct+"</td></tr>");
        }

        }

      } 
    });
  });
  </script>

</body>
</html>
在我开始包含“下拉列表”之前，我只需要一个简单的json_编码（$data）；它可以很好地工作，而且桌子上显示的正是我想要的。由于我添加了另一个要传递的阵列，这是事情变得疯狂的时候，我完全迷路了

我知道我的编码可能很差，但我只是想弄清楚这一点。感谢所有帮助。

问题在于成功处理程序中的代码需要返回一个数组：

success: function(verticals) //on recieve of reply
{
    for (var i in verticals)
    {
        var vertical = verticals[i];
        var verticalID = verticals[0];

        $('station').append("<option value=\""+verticalID+"\">"+verticalID+"</option>");
    }

}
如您所见，
verticals
是一个对象，它包含两个其他对象（
rowdata
和
verticaldata
）

要使当前的成功处理程序再次工作，首先需要从AJAX响应中提取
verticaldata
。只需将代码更改为此即可：

success: function(response) //on recieve of reply
{
    var verticals = response.verticaldata;
    for (var i in verticals)
    {
        var vertical = verticals[i];
        var verticalID = verticals[0];

        $('station').append("<option value=\""+verticalID+"\">"+verticalID+"</option>");
    }
} 

success:function（response）//收到回复时
{
垂直变量=响应垂直数据；
用于（垂直方向的var i）
{
垂直向量=垂直向量[i]；
var verticalID=垂直[0]；
$（'station'）。追加（“+verticalID+”）；
}
}
因为您使用的是PHP和jQuery，所以可以使用我的库。开箱即用地处理从PHP到Javascript的任何数据，反之亦然；）

看这里

你的情况是这样的

这样就可以了！非常感谢。我还是个笨蛋，但我正在学习，你的解释正是我所希望的！非常感谢！我相信这是一个很好的解决方案-谢谢你把它放在那里。我将检查你的图书馆，并把它用于未来！！谢谢没问题，当直接从PHP操作HTML时，它考虑到了从客户机中减少必要的代码

success: function(verticals) //on recieve of reply
{
    for (var i in verticals)
    {
        var vertical = verticals[i];
        var verticalID = verticals[0];

        $('station').append("<option value=\""+verticalID+"\">"+verticalID+"</option>");
    }

} 



{"rowdata":[[...],[...]],"verticaldata":[["canceled"],["Vertical B"]]} 



success: function(response) //on recieve of reply
{
    var verticals = response.verticaldata;
    for (var i in verticals)
    {
        var vertical = verticals[i];
        var verticalID = verticals[0];

        $('station').append("<option value=\""+verticalID+"\">"+verticalID+"</option>");
    }
}