PHP массив JavaScript, в цикле

Question

Прежде всего у меня есть следующая MySQL имя таблицы, как store_items:

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(); 

}); 

Но я не могу добиться правильного отображения; то, что я стремлюсь к что-то вроде этого:

Но выше изображение отображается правильно, когда 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 массив правильно?

Любые предложения будут оценены.

Answer 1

Может быть, я что-то не хватает (в этом случае комментарий и я буду править мой ответ), но я думаю, что вам просто нужно заменить:

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

с:

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

и ваши «данные» должны быть точно array_code

Answer 2

Вам не нужно использовать $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>