从php检索数据到jquery并将其插入到DataTable中

时间:2018-10-19 11:55:14

标签: php html mysql datatable bootstrap-4

我想从数据库中刷新表的内容,因此当用户按下刷新按钮时,我将通过php从数据库中检索数据,并将此数据发送到jquery,该jquery可以将检索到的数据插入表中,但是我可以成功检索数据无法将其插入数据表 这是从数据库检索数据的php代码;

    elseif ($id=='refresh_logs'){

	  $shortname=$_GET['shortname'];
     	$data_array = array();
    $bul="select radacct.UserName,radacct.AcctStartTime,radacct.AcctStopTime,radacct.AcctOutputOctets,radacct.AcctInputOctets,AcctSessionTime,FramedIPAddress,os.mac,nas.shortname,os_platform,acctupdatetime ,RadAcctId from radacct Left join os on os.username=radacct.UserName and os.AcctSessionid=radacct.AcctSessionId left join nas on radacct.NASIPAddress = nas.nasname where nas.shortname='$shortname' limit 1";
	//echo($bul);
	$result2 = $con2->query($bul);
	 while($row = $result2->fetch_assoc()) {
		  $upload=round($row['AcctOutputOctets']/1024/1024,2);
		 
		  $download=round($row['AcctInputOctets']/1024/1024,2);
		 if ($row['AcctSessionTime']<60) {
				 	$sure=$row['AcctSessionTime']." Sec";
				}
		 else {
					$gun=floor($row['AcctSessionTime']/86400);
					$saat=floor(($row['AcctSessionTime'] - $gun*86400)/3600);
					$dakika=floor(($row['AcctSessionTime'] - $gun*86400 - $saat*3600)/60);
					$sure="";
					if ($dakika>0){
					  $sure=$dakika." Min";
	 				}
					if ($saat>0){
	 					$sure=$saat." Hour ".$sure;
					}
					if ($gun>0){
						$sure=$gun." Day ".$sure;
				  }
				}
		 $row['upload']=$upload;
		 $row['download']=$download;
		 $row['sure']=$sure;
	   array_push($data_array,$row);
	   
	   
	   
	   }

			$data_array=json_encode($data_array);	
	echo $format = '{
"data":['.$data_array.']}';
	
}

这是将检索到的数据插入表中的jQuery代码

$('.refresh').click(function(e) {
    e.preventDefault();


    var string ='';
    var nas_shortname=$('#nas_shortname').val();

    var jsonData = $.ajax({ async: false,
      url: "Save.php?id=refresh_logs&shortname="+nas_shortname,

      dataType: "json"

      }).responseText;
        //}

var obj = $.parseJSON(jsonData);
$('#resultt').html('<img src="dist/img/ajax_loader_red_128.gif"/>');
$('#my_logs tbody ').remove();







$.fn.dataTable.ext.errMode = 'throw';
var table = $('#my_logs').DataTable({
"processing": true,
"serverSide": true,
"ajax": obj,
"sScrollY": "300px",
"scrollX":true,
"paging": false,
"bFilter": false,
"bInfo": false,
"searching": false,
"bSort" : false,
"fixedColumns":   true
});


$('#resultt').html('OK');
}); 



});

我在控制台中遇到此错误

  

DataTables警告:表id = my_logs-无效的JSON响应。有关此错误的更多信息,请参见http://datatables.net/tn/1       在J(VM2914 jquery.dataTables.min.js:74)

这是我从服务器端发送到jQuery的json数据

[{"UserName":"root2","AcctStartTime":"2018-10-18 15:52:52","AcctStopTime":null,"AcctOutputOctets":"0","AcctInputOctets":"0","AcctSessionTime":"0","FramedIPAddress":"192.168.33.3","CallingStationId":"192.168.33.3","shortname":"radius2_nas1","os_platform":null,"acctupdatetime":"2018-10-18 15:52:52","RadAcctId":"1","upload":0,"download":0,"sure":"0 Sec"},{"UserName":"root","AcctStartTime":"2018-10-18 16:07:00","AcctStopTime":null,"AcctOutputOctets":"0","AcctInputOctets":"0","AcctSessionTime":"0","FramedIPAddress":"192.168.33.3","CallingStationId":"192.168.33.3","shortname":"radius2_nas1","os_platform":null,"acctupdatetime":"2018-10-18 16:07:00","RadAcctId":"2","upload":0,"download":0,"sure":"0 Sec"}]

1 个答案:

答案 0 :(得分:0)

从PHP方面来看,您的$data_array应该如下所示:

Array
(
[draw] => 1
[recordsTotal] => 4827
[recordsFiltered] => 4827
[data] => Array
     (
        [0] => Array
            (
                [UserName] => root2
                [AcctStartTime] => 2018-10-18 15:52:52 
                [AcctStopTime] => 
                [AcctOutputOctets] => 0
                [AcctInputOctets] => 0
                [AcctSessionTime] => 0
                [FramedIPAddress] => 192.168.33.3
                [CallingStationId] => 192.168.33.3
                [shortname] => radius2_nas1
                [os_platform] => 
                [acctupdatetime] => 2018-10-18 15:52:52
                [RadAcctId] => 1
                [upload] => 0
                [download] => 0
                [sure] => 0 Sec
            )
        [1] => Array
            (
                [UserName] => root3
                [AcctStartTime] => 2018-10-18 15:52:52 
                [AcctStopTime] => 
                [AcctOutputOctets] => 0
                [AcctInputOctets] => 0
                [AcctSessionTime] => 0
                [FramedIPAddress] => 192.168.33.3
                [CallingStationId] => 192.168.33.3
                [shortname] => radius2_nas1
                [os_platform] => 
                [acctupdatetime] => 2018-10-18 15:52:52
                [RadAcctId] => 1
                [upload] => 0
                [download] => 0
                [sure] => 0 Sec
            )
        [2] => Array
            (
                [UserName] => root4
                [AcctStartTime] => 2018-10-18 15:52:52 
                [AcctStopTime] => 
                [AcctOutputOctets] => 0
                [AcctInputOctets] => 0
                [AcctSessionTime] => 0
                [FramedIPAddress] => 192.168.33.3
                [CallingStationId] => 192.168.33.3
                [shortname] => radius2_nas1
                [os_platform] => 
                [acctupdatetime] => 2018-10-18 15:52:52
                [RadAcctId] => 1
                [upload] => 0
                [download] => 0
                [sure] => 0 Sec
            )
        ...

     )
)

json_encode()之后,您的响应数据必须如下:

{"draw":1,"recordsTotal":4827,"recordsFiltered":4827,"data":[{"UserName":"root2","AcctStartTime":"2018-10-18 15:52:52","AcctStopTime":null,"AcctOutputOctets":"0","AcctInputOctets":"0","AcctSessionTime":"0","FramedIPAddress":"192.168.33.3","CallingStationId":"192.168.33.3","shortname":"radius2_nas1","os_platform":null,"acctupdatetime":"2018-10-18 15:52:52","RadAcctId":"1","upload":0,"download":0,"sure":"0 Sec"},{"UserName":"root","AcctStartTime":"2018-10-18 16:07:00","AcctStopTime":null,"AcctOutputOctets":"0","AcctInputOctets":"0","AcctSessionTime":"0","FramedIPAddress":"192.168.33.3","CallingStationId":"192.168.33.3","shortname":"radius2_nas1","os_platform":null,"acctupdatetime":"2018-10-18 16:07:00","RadAcctId":"2","upload":0,"download":0,"sure":"0 Sec"}]}

您还可以检查 json在https://jsonlint.com/上是否有效

如果您未能根据需要成功检索服务器端数据表,则您可以遵循 Datatable's Serverside example