CODEWITHSUNDEEP
javascriptjsongoogle-visualization
nazanin
nazanin

Reputation: 73

“Invalid JSON string” in Google visualization API example

I'm trying to draw table through Google visualization API based on mysql database

<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript" src="jquery-1.11.1.min.js"></script>
<script type="text/javascript">

 google.load('visualization', '1.0', {'packages':['table']});
 google.setOnLoadCallback(drawItems);

 function drawItems(num) {
    //alert(num.value);     
  var jsonTableData = $.ajax({
  url: "gettabledata.php",
  data: "q="+num,
  dataType:"json",
  async: false
}).responseText;

The client side javascript code that receives the json:

 var tabledata = new google.visualization.DataTable(jsonTableData);
 var table = new google.visualization.Table(document.getElementById('table_div'));
 table.draw(tabledata);
 }

This causes the following error on constructing the DataTable object (first line):

Uncaught Error: Invalid JSON string

This is the json (generated by the google api):

{"cols":[{"id":"Name","label":"Arr Name","type":"string"},{"id":"PMU","label":"PMU","type":"string"}],"rows":[{"c":[{"v":"a_b_c_Yellow"},{"v":"b"}]}]}

Upvotes: 0

Views: 1433

Answers (1)

JstnPwll
JstnPwll

Reputation: 8685

The JSON you provided works, as seen in this fiddle. I hardcoded the data like this:

google.load('visualization', '1.0', {'packages':['table']});
google.setOnLoadCallback(drawItems);

function drawItems(num) {  
    var jsonTableData = '{"cols":[{"id":"Name","label":"Arr Name","type":"string"},{"id":"PMU","label":"PMU","type":"string"}],"rows":[{"c":[{"v":"a_b_c_Yellow"},{"v":"b"}]}]}';

    var tabledata = new google.visualization.DataTable(jsonTableData);
    var table = new google.visualization.Table(document.getElementById('table_div'));
    table.draw(tabledata);
}

This means that the JSON string you shared here is not exactly the same as the one being returned from your php file. Check to make sure there are no invisible or unexpected characters in your response.

Upvotes: 1

Related Questions