从 PHP 在 JS 中将数组作为回调数据发送

Question

我有一个仪表板页面来显示从数据库获取的过去五天的出勤数据。为此，我从脚本调用我在单独的 .js 文件中定义的函数。使用 php 函数，我将数据作为回调数据发送回 Javascript 函数。我在 Javascript 中，我不知道如何处理这个数组数据。实际上，我从一个示例应用程序中得到了这个想法，可以很好地处理字符串，但我无法为数组编写代码。 index.php 页面

       <div class="inner">                              
            <table  class="table table-borderless table-condensed ">
            <thead><tr><th>Date</th><th>Total</th></tr></thead>
            <tbody id ="attendancelist">                    
            </tbody>
            </table>
        </div>
    <script>
    modJs.getlastfiveattendance(); 
   </script>

JS 文件：

Display.method('getlastfiveattendance', function() {
    var that = this;
    var object = {"emp_id":empId};  
    var reqJson = JSON.stringify(object);
    var callBackData = [];
    callBackData['callBackData'] = [];
    callBackData['callBackSuccess'] = 'getlastPunchSuccessCallBack';
    callBackData['callBackFail'] = 'getlastPunchFailCallBack';  
    this.customAction('getLastfive','modules=attendance',reqJson,callBackData);
});

Display.method('getlastPunchSuccessCallBack', function(callBackData) {  
    var punches = callBackData; 
    $('#attendancelist').html('');
    var row = '<tr><td>_date_</td><td>_total_</td></tr>';   

    $.each( punches, function(key, value) {  //here i have to process this array to get each data
    var trow = row;     
        trow = trow.replace(/_date_/g,Date.parse(key).toString('MMM d, yyyy (dddd)'));
        trow = trow.replace(/_total_/g,value);
        html += trow;   
    });
    $('#attendancelist').html(html);        

});    
Display.method('getlastPunchFailCallBack', function(callBackData) {     
    this.showMessage("error","Failed to Retrieve data");        
});

在 PHP 文件中，我获取数据并将其作为数组传递，只是我需要该特定日期的日期和总小时数。

public function getLastfive($req){          
        empid = $req->emp_id;           
        $attendance = new Attendance();
        $attendanceList = $attendance->Find("employee = ? ORDER BY id DESC LIMIT 5",array(empid));          
        $dayMap = array();          
        foreach($attendanceList as $attendance){
            $dayMap[$attendance->in_time] = $attendance->note; //emp in_time as key and the total time as value
        }   
        return new simRes(simRes::SUCCESS,$dayMap);         
    }

但是这里的控件没有进入 $.each 循环。当我通过以下代码检查拳头是否为数组时，请使用以下代码。 IT 显示为非数组。

if( Object.prototype.toString.call( punches ) === '[object Array]' ) {
    this.showMessage("yes","It's array");
    }
    else
        this.showMessage("No","Its no array");

simRes 类内部：

class SimRes{   
    const SUCCESS = "SUCCESS";
    const ERROR = "ERROR";  
    var $status;
    var $data;
    public function __construct($status,$data = null){
        $this->status = $status;    
        $this->data = $data;    
    }   
    public function getStatus(){
        return $this->status;
    }   
    public function getData(){
        return $this->data;
    }   
    public function getJsonArray(){
        return array("status"=>$this->status,"data"=>$this->data);
    }
}

Answer 1

试试这个：

在您的 PHP 部分：

public function getLastfive($req){          
    $attendance = new Attendance();
    $attendanceList = $attendance->Find("employee = ? ORDERBY id DESC LIMIT 5)",array((int)$req->emp_id));    
    $dayMap = array();   
    // generating array of attendances with key value
    foreach($attendanceList as $attendance){
        $dayMap[] = [
            'date' => $attendance->in_time,
            'total' => $attendance->note
        ];
    }

    return new simRes(simRes::SUCCESS, json_encode($dayMap)); // I don't know if it's already json-ifies result, but if Yes, so remove json_encode
}

在您的 HTML 中（包括 lodash 库，它简化了 JS 的使用）：

<script src="https://raw.githubusercontent.com/lodash/lodash/4.6.1/dist/lodash.min.js"></script>

在你的 JS 代码中：

Display.method('getlastPunchSuccessCallBack', function(callBackData) { 
    $('#attendancelist').html(''); // making empty before processing data

    // if response is string, it happens when You don't send application/json content type on response headers
    if(_.isString(callBackData)) {
        callBackData = JSON.parse(callBackData); // parse string make it json
    }
    if(!_.isArray(callBackData)) { // if it's not array of objects, so stop here
        return;
    }

    var punches = callBackData;

    var html = ''; // create empty var to generate html
    _.each(punches, function(punch) { 
        // iterate array of punches and pass punch to iterator function
        // punch is object like {date: "some date", total: "some value"}

        html+='<tr>';
        html+='<td>'+Date.parse(punch.date).toString('MMM d, yyyy (dddd)')+'</td>';
        html+='<td>'+punch.total+'</td>';
        html+='</tr>';
    });

    $('#attendancelist').html(html);   
});