如何循环遍历ajax函数并通过循环顺序从数据库中检索结果

时间:2016-07-30 07:53:36

标签: javascript php jquery ajax

我正在做一个网站。在这个网站上,我必须显示每个传感器设备的温度。 Image of the sensor details。我通过循环浏览获取这些传感器信息。现在,我想让它们活着。这意味着我想显示每个设备的实时温度。我做了一些编码部分,没有通过ajax调用循环整个设备。我将设备信息存储在ul li标签中。 Image of ul li。在这里,您可以看到每个li代表自己的设备代码'和'网站页面' (在这种情况下'网站页面'是相同的)。现在我想循环每个li并根据每个设备代码检索温度值。和'网站页面'。

这是我的jquery / ajax函数:

    setInterval(function() {

    var lis = $('#ul-devices li').length;

    for(x=0; x<lis; x++){

    var site_device_code = $('#ul-devices li:nth-child('+ (x+1) +')').data('device-code');
    var sitePageId = $('#ul-devices li:nth-child('+ (x+1) +')').data('site-page')

        $.ajax({
            url: 'sitefunction.php',
            type: 'post',
            data: { 'sitePageId' : sitePageId, 'device_code' : site_device_code },
            success:function(data){
                console.log(sitePageId);
                console.log(site_device_code);              
                console.log(data.temp_value);
            }
        });
    }

}, 1000);

现在这是我的php函数(sitefunction.php):

require_once 'inc/core/init.php';
$db = DB::getInstance();
if(Input::get('sitePageId') && Input::get('device_code')) {

    $sitePageId = Input::get('sitePageId');
    $device_code = Input::get('device_code');

    $sensorsInfo = $db->sqlQuery("SELECT * FROM `device_info` WHERE `site_code` = {$sitePageId} AND `device_code` = {$device_code}");

    while($sensor = $sensors->fetch(PDO::FETCH_OBJ)){
        $temp_value = $sensor->value;
        $last_updated = $sensor->last_updated;
    };

    $result = array(
            'temp_value' => $temp_value,
            'last_updated' => $last_updated
        );

    echo json_encode($result);
}

这里$ db表示数据库连接类。

现在的问题是,当我运行此代码时,结果为the result image,您可以看到以下值正在重复,

1 (sitePageId)
8627334 (last li tag's device_code)
undefined (data.temp_value)

我希望结果应该像这样(在控制台中),

1 (sitePageId)
312169 (device_code)
34 (data.temp_value)

1
13618979
255

1
312890
33.25

1
8627813
41

1
8627334
23

如果有人知道如何解决这个问题,请帮我解决。

更新

这是我的jquery代码:

    setInterval(function() {

    var lis = $('#ul-devices li').length;

    for(x=0; x<lis; x++){

    var site_device_code = $('#ul-devices li:nth-child('+ (x+1) +')').data('device-code');
    var sitePageId = $('#ul-devices li:nth-child('+ (x+1) +')').data('site-page')

        $.ajax({
            url: 'sitefunction.php',
            type: 'post',
            data: { 'sitePageId' : sitePageId, 'device_code' : site_device_code },
            success:function(data){
                for( var d in data ){
                    console.log(d.site_code); //site_code,device_code,value are database field names
                    console.log(d.device_code);             
                    console.log(d.value);
                }
            }
        });
    }

}, 1000);

这是我的PHP代码:

require_once 'inc/core/init.php';
$db = DB::getInstance();
if(Input::get('sitePageId') && Input::get('device_code')) {

    $sitePageId = Input::get('sitePageId');
    $device_code = Input::get('device_code');

    $sensors = $db->sqlQuery("SELECT * FROM `device_info` WHERE `site_code` = {$sitePageId} AND `device_code` = {$device_code}");

    $rows = array();

    while($sensor = $sensors->fetch(PDO::FETCH_ASSOC)){
        $rows[] = $sensor;
    };

    echo json_encode($rows);
}

这是我的数据库表: database table

更新结果

updated result

2 个答案:

答案 0 :(得分:0)

您将需要一个多维返回数组,目前您只返回最后一条记录的数据。你需要改变这个

 while($sensor = $sensors->fetch(PDO::FETCH_OBJ)){
    //these variables are overwritten on each itteration
    $temp_value = $sensor->value;
    $last_updated = $sensor->last_updated;
};

//Those 2 vars only contain the last row now...
//results here is a single dimensional array of only one row.
$result = array(
        'temp_value' => $temp_value,
        'last_updated' => $last_updated
    );

上面while中的每个循环都会覆盖这两个变量,所以在循环结束时你只得到DB结果集中的最后一条记录,主要是因为你访问了循环之外的变量。所以你需要把它改成:

 $rows = array();
 while($row = $sensors->fetch(PDO::FETCH_ASSOC)){
   $rows[] = $row;
};

 echo json_encode($rows);

使用FETCH_ASSOC您无需将其转换为数组。你的数组应该看起来像这样(在循环之后)

$rows = array(
      array( 'sitePageId'=>1, 'device_code' => 312169, 'temp_value' => 34 ),
       array( 'sitePageId'=>1, 'device_code' => 4445455, 'temp_value' => 27),
   .... 
);

而不是这个(原始数据)

   $results = array( 'sitePageId'=>1, 'device_code' => 312169, 'temp_value' => 34 );

然后在JS成功回调中你可以这样做:

   success:function(data){
        for( var d in data ){
            console.log(d.sitePageId);
            console.log(d.device_code);              
            console.log(d.temp_value);
       }
    }

因为你的Json会像这样

    [
       { sitePageId:1, device_code:312169, temp_value:34 },
       { sitePageId:1, device_code:4445455, temp_value:27},
        .... 
   ]

如果查询返回这些字段sitePageId, device_code, temp_value,我认为你没有sitePageId,但是你得到了我确定的想法。基本上只需打开多维数组。

答案 1 :(得分:0)

使用Jquery循环控件解决问题

$('#ul-devices li').each(function(i, n){
  console.log("device=" + $(n).data("device-code") + ", page=" + $(n).data("site-page"));
});