2016-11-27 104 views
0

首先我有以下MySQL表名作爲store_itemsPHP數組的Javascript在一個循環

id ref store item qty sell 
1 2 m1 001 1 12.00 
2 2 m1 002 3 12.00 
3 3 m3 004 4 5.00 
4 3 m3 003 8 10.00 

並配有簡單的PHP代碼上述行轉換爲數組開始

<?php 
$query = "SELECT * FROM store_items ORDER by store Asc"; 
$result = mysql_query($query); 
while ($row = mysql_fetch_assoc($result)){ 
    $data[] = $row; 
} 

//This is for moving PHP array to JS array ? Not sure if it is correct 
$js_arr = json_encode($data); 

?> 

現在我一直在尋找一種方式而不是將它顯示爲表格,所以我想將這些結果放在一個Excel外觀裏,所以我發現這個插件叫做:Javascript Handsontable

移動的,將樣式表和腳本後:

<script src="http://localhost/handsontable-master/dist/handsontable.full.js"></script> 
<link rel="stylesheet" media="screen" href="http://localhost/handsontable-master/dist/handsontable.full.css"> 
<link rel="stylesheet" media="screen" href="http://localhost/handsontable-master/demo/css/samples.css"> 
<link rel="stylesheet" media="screen" href="http://localhost/handsontable-master/demo/css/samples.css"> 
<link rel="stylesheet" media="screen" href="http://localhost/handsontable-master/demo/css/samples.css"> 

<style type="text/css"> 
body {background: white; margin: auto;} 
h2 {margin: 20px 0;} 
</style> 


<div id="example" class="handsontable htColumnHeaders"></div> 

於是問題就出現在這裏:

<script> 
var array_code = '<?php echo $js_arr; ?>'; 
//Alerting result to make sure its correct 
alert(array_code); 

$(document).ready(function() { 

//Not sure how to display the results here ??? 
    var 
    data = 
    [ 
    array_code 
    ], 

    container = document.getElementById('example'), 
    hot; 

    hot = new Handsontable(container, { 
    data: data, 
    minSpareRows: 1, 
    colHeaders: true, 
    contextMenu: true 
    }); 


    function bindDumpButton() { 

     Handsontable.Dom.addEvent(document.body, 'click', function (e) { 

     var element = e.target || e.srcElement; 

     if (element.nodeName == "BUTTON" && element.name == 'dump') { 
      var name = element.getAttribute('data-dump'); 
      var instance = element.getAttribute('data-instance'); 
      var hot = window[instance]; 
      console.log('data of ' + name, hot.getData()); 
     } 
     }); 
    } 
    bindDumpButton(); 

}); 

但我不能達到正確顯示;什麼我的目標是這樣的:

Correct result

但當var data數組的值是這樣

var 
    data = [ 
     ['1', '2', 'm1', '001', '1', '12.00'], 
     ['2', '2', 'm1', '002', '3', '12.00'], 
     ['3', '3', 'm3', '004', '4', '5.00'], 

    ], 

我怎樣才能把裏面的PHP數組值上圖所示正確JS數組是否正確?

任何建議,將不勝感激。

+0

$ js_arr = json_encode($ data)會生成JSON格式的數據。 – Perumal

+0

@ Perumal93對不起,我在這裏錯過了一些東西,是否正確? –

+1

你想要將數組數據直接放入表中並顯示它們? – Perumal

回答

0

也許我失去了一些東西(在這種情況下評論,我會編輯我的答案),但我認爲你只需要更換:

while ($row = mysql_fetch_assoc($result)){ 
    $data[] = $row; 
} 

有:

while ($row = mysql_fetch_row($result)){ 
    $data[] = $row; 
} 

和你的「數據」應該是完全array_code

+0

讓我試試看,只需一秒鐘。 –

+0

在將assoc關聯到行後,警告框會正確顯示結果,但在表格中顯示結果時,會將每個單個字符/數字放在單元格中。如果你想我會張貼結果的圖片 –

0

你不需要使用$js_arr = json_encode($data);顯示HTML表格中的數據,因爲它會產生JSON格式的數據,如果你不打算去m使用JavaScript來調整表格,你可以避免這樣做。只需添加以下HTML代碼並根據需要添加樣式:

<table> 
    <thead> 
     <th>A</th> 
     <th>B</th> 
     <th>C</th> 
     <th>D</th> 
     <th>E</th> 
     <th>F</th> 
    </thead> 
    <tbody> 
     <?php if(!empty($data)): ?> 
      <?php foreach($data as $row): ?> 
       <tr> 
        <td><?= $row['id'] ?></td> 
        <td><?= $row['ref'] ?></td> 
        <td><?= $row['store'] ?></td> 
        <td><?= $row['item'] ?></td> 
        <td><?= $row['qty'] ?></td> 
        <td><?= $row['sell'] ?></td> 
       </tr> 
      <?php endforeach; ?> 
     <?php endif; ?> 
    </tbody> 
</table>