CODEWITHSUNDEEP
javascriptphpmysql
user3219845
user3219845

Reputation: 1

Google JavaScript Table

Is possible to make this script take MySQL data? Can anybody show me?

This script is from google chars, table ... I try to make this script take MySQL data and display in a table.

<html>
  <head>
    <script type='text/javascript' src='https://www.google.com/jsapi'></script>
    <script type='text/javascript'>
      google.load('visualization', '1', {packages:['table']});
      google.setOnLoadCallback(drawTable);
      function drawTable() {
        var data = new google.visualization.DataTable();
        data.addColumn('string', 'Name');
        data.addColumn('number', 'Salary');
        data.addColumn('boolean', 'Full Time Employee');
        data.addRows([
          ['Mike',  {v: 10000, f: '$10,000'}, true],
          ['Jim',   {v:8000,   f: '$8,000'},  false],
          ['Alice', {v: 12500, f: '$12,500'}, true],
          ['Bob',   {v: 7000,  f: '$7,000'},  true]
        ]);

        var table = new google.visualization.Table(document.getElementById('table_div'));
        table.draw(data, {showRowNumber: true});
      }
    </script>
  </head>

  <body>
    <div id='table_div'></div>
  </body>
</html>

Upvotes: 0

Views: 85

Answers (1)

php-dev
php-dev

Reputation: 7156

just fill your php array with values like this

$array = array(
    array(
        array('01', array('v' => 10000, 'f' => '$10,000'), 'Mike'),
        ...
        array('12', array('v' => 12500, 'f' => '$12,200'), 'Mike'),
    )
);

then in your HTML code write : 

/* code starts here ... */
function drawTable() {
        var data = new google.visualization.DataTable();
        data.addColumn('string', 'ID');
        data.addColumn('number', 'Salariu');
        data.addColumn('string', 'Name');
        data.addRows(<?php echo json_encode($array) ?>);

        var table = new google.visualization.Table(document.getElementById('table_div'));
        table.draw(data, {showRowNumber: true});
      }

/* rest of code */

UPDATE

You have updated your source code and the addRows method argument format has changed, This how you should fill your php array (Drop the global array);

$array = array(
    array('01', array('v' => 10000, 'f' => '$10,000'), 'Mike'),
    ...
    array('12', array('v' => 12500, 'f' => '$12,200'), 'Mike'),
);

UPDATE 2 Help with mysql data retrieving

$array = array();
$result = mysql_query('SELECT f1, f2, f3, f4 FROM some_table');
while($row = mysql_fetch_assoc($result)) {
    $array[] = array($row['f1'], array('v' => $row['f2'], 'f' => $row['f3']), $row['f4']);
}

//Your array is now filled

Hope it helps

Upvotes: 2

Related Questions