Unable to parse report in dhtmlx grid - javascript

On calling grid.parse(jsonstr, 'json') in js code the report is not getting displayed nor it throws any error though all the headers are getting displayed. Code below:
function getReportData(data) {
var gr = new dhtmlXGridObject('gridbox');
gr.selMultiRows = true;
gr.setHeader(data['tVals']['header']);
gr.setInitWidths(data['tVals']['init_widths']);
gr.setColAlign(data['tVals']['col_align']);
gr.setColTypes(data['tVals']['col_types']);
gr.setColSorting("str,str");
gr.init();
gr.parse(data['gData'], 'json');
}
PS: data has all the relevant information required by the code.
Also my html has following js imports:
dhtmlxcommon.js
dhtmlxgrid.js
dhtmlxgridcell.js
dhtmlxtreegrid.js
dhtmlxgrid_json.js
dhtmlxgrid_hextra.js
jquery version 1.6.1

The issue is seems to be in the format of your JSON. Can you provide a sample of your JSON string?
You can find an example of valid JSON supported by dhtmlxGrid here:
http://docs.dhtmlx.com/doku.php?id=dhtmlxgrid:syntax_templates#json_format_details

It would really help if you posted your JSON format, however I think I know what your problem is:
There are two formats of JSON that you can use in DHTMLX ( more details on https://docs.dhtmlx.com/grid__data_formats.html#jsonformat)
So the solution to your issue should be very simple.
Change
gr.parse(data['gData'], 'json');
to
gr.parse(data['gData'], 'js');

Related

$.getJSON not working when using getSongBPM

New to this, please excuse my ignorance.
I would like to get the bpm of a song from getsongbpm public api. There is no data being outputted to the console.
// api key has been changed
$.getJSON("https://api.getsongbpm.com/song/api_key=f9af182c18730&id=983pB", function(data){
console.log(data);
var tempo = data.song.tempo;
console.log(tempo);
$(".bpm").append(tempo);
});
I expect the console to have the output of the data in JSON format. I used this video for reference.
https://www.youtube.com/watch?v=InoAIgBZIEA
You have to fix that header problem with 'Cross-origin resource sharing (CORS)' or for testing only you can install 'Moesif CORS' chrome plugin and it works.

Three .json files 'StockChart' - highcharts

Please help by taking StockChart. Pinning three .json files as in the example , But does not work. The code is below:
www.jsfiddle.net/d8xwjxg7/2
You have an error in your code:
$.getJSON('http://www.iklimat.pl/'+name()+'.php', function (data) {
Should be:
$.getJSON('http://www.iklimat.pl/'+ name +'.php', function (data) {
Since name is a string not a function.
Also, this will not work in a JSFiddle since you cannot load files not from the site the javascript is running on without the endpoint you are accessing setting the access-allow-control-origin header.
EDIT:
I have sorted out the issue you were having getting data, however there is an issue with that data.
http://jsfiddle.net/d8xwjxg7/5/

Issue with JSON.parse , don't know why is not parsing everything

I'm developing a web app with Node.js using Sails framework(based on Express) and i'm using a third party image solution called Transloadit (no need to know Transloadit).
Anyway, that's not the problem, i'm been able to implement the Transloadit form and receive the information from their API.
My problem is that, Transloadit gives me the response as a String, and I need to access the response objects, so i'm using var objRes = JSON.parse(req.body.transloadit); to parse it to an JSON object, and when I console.log(objRes); the object is not correctly parsed, i get this: (see all JSON here https://gist.github.com/kevinblanco/9631085 )
{
a bunch of fields here .....
last_seq: 2,
results: {
thumb: [
[
Object
]
]
}
}
And I need the data from the thumb array, my question is, Why is doing that when parsing ?
Here's the entire request req.body object: https://gist.github.com/kevinblanco/9628156 as you can see the transloadit field is a string, and I need the data from some of their fields.
Thanks in advance.
There is nothing wrong with the parsing of the JSON -- in fact there is no problem at all.
consol.log limits the depth of what it is printing which is why you are seeing [object] in the output.
If you want to see the full output in node.js then just use the inspect utility like this;
console.log(util.inspect( yourobject, {depth:null} ));
and that will print the entire content.
Note that this is just an artifact of console.log printing it.

Codeigniter - sending json to script file

I query the db i my model like so
function graphRate($userid, $courseid){
$query = $this->db->get('tblGraph');
return $query->result();
}
My controller gets data back from my model and I json encode it like so
if($query = $this->rate_model->graphRate($userid, $courseid)){
$data['graph_json'] = json_encode($query);
}
$this->load->view('graph', $data);
And thats returns me a json object like so
[
{"id":"1","title":"myTitle","score":"16","date":"2013-08-02"},
{"id":"2","title":"myTitle2","score":"17","date":"2013-09-02"},
{"id":"3","title":"myTitle3","score":"18","date":"2013-10-02"}
]
In my view graph I'm loading an js file
<script type="text/javascript" src="script.js"></script>
Now I want to use $data that is being sent from my controller to my view, to my external script.js to use as labels and data to feed my chart. But How do I get that Json data to my external script.js so I can use it?
1 more thing about the json data, isn't it possible to get the output of the json data as
{
"obj1":{"id":"1","title":"myTitle","score":"16","date":"2013-08-02"},
"obj2":{"id":"2","title":"myTitle2","score":"17","date":"2013-09-02"},
"obj3":{"id":"3","title":"myTitle3","score":"18","date":"2013-10-02"}
}
The problem isn't a Codeigniter problem, it's a javascript scope/file inclusion/where-do-i-get-my-data-from problem.
I run into this all the time and have used these solutions:
naming my php files with .php extensions and loading them as if they're views.
Just putting the script that needs data from a view IN the view file where it's used
Using an ajax request in my included js file to hit a controller and get json data.
I use #2 most frequently (for things like datatables where I WANT the js code right there next to the table it's referencing.
I use #1 occasionally, but try NOT to do that because it means some .js files are in my webroot/js dir and some are in teh application/views directory, making it confusing for me or anyone else who wants to support this project.
#3 is sometimes necessary...but I like to avoid that approach to minimize the number of requests being made and to try to eliminate totally superfluous requests (which that is).
You need to print the result of the output json string to the html generated file.
But you need to parse the string with some script. I would recommend you: http://api.jquery.com/jQuery.parseJSON/
For the second question. It is possible by doing:
$returnValue = json_encode(
array (
"obj1" => array("id"=>"1","title"=>"myTitle","score"=>"16","date"=>"2013-08-02"),
"obj2" => array("id"=>"2","title"=>"myTitle2","score"=>"17","date"=>"2013-09-02"),
"obj3" => array("id"=>"3","title"=>"myTitle3","score"=>"18","date"=>"2013-10-02"),
)
);
Print the output using PHP like:
echo json_encode($query);
Then from the client-side (where JavaScript resides) load that JSON that you printed using PHP. This can be done easily using JQuery.
Like this:
$.get("test.php", function(data) {
alert("Data Loaded: " + data);
});
You can find more information about this here: http://api.jquery.com/jQuery.get/
Now you'll need to parse this data so that JavaScript can understand what you got as text from the server. For that you can use the JSON.parse method on the "data" object in the aforementioned example. Once parsed, you can use the object like any other object in JavaScript. You can find more information about JSON.parse here: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON/parse
I hope that helps.

Incorrect JSON data format

I am trying to create some JSON to be used for displaying a chart using Highcharts
http://www.highcharts.com/
I have copied one of their examples:
http://www.highcharts.com/stock/demo/basic-line
Click "View Options" under the graph to see the source. There is also a JSFiddle there to play with
If I copy that locally it all works fine.
The problem is when I try to use my own data source.
I have an ASP.Net MVC controler which is spitting out a list of arrays, just like their data source. However, that doesn't work.
Their datasource looks like this
http://www.highcharts.com/samples/data/jsonp.php?filename=aapl-c.json&callback=?
and they retrieve it like this
$.getJSON('http://www.highcharts.com/samples/data/jsonp.php?filename=aapl-c.json&callback=?', function (data) {
So I thought I'd take a step back and copy thier data exactly and put it in a text file on my server and try that:
So I tried this
$.getJSON('/data.txt', function (data) {
and this
$.get('/data.txt', function (data) {
but neither work
I have also tried using both JSON.parse and jQuery.parseJSON after retrieving the data, but again - that doesn't seem to work
I am also wondering what the ? is at the start of their data
Their data looks like this
?([[<some data>],[some data]]);
I don't get any error message, the graph just doesn't display
any ideas?
SOLVED IT
Just need to retrive the data and turn it into an array and pass it to the chart.
Needs to be an array, not JSON
That datasource is ouputting JSONP, which is for cross-domain AJAX requests. It's not valid 'raw' JSON because of that extra callback(...) wrapper.
Read up about it here: http://api.jquery.com/jQuery.ajax/ under the 'dataType' section.
As you say in your tags, it's not JSON, it's JSONP. Do not parse it, catch it with a callback. Use jQuery.getScript to do it, and define function callback(data). Inside that function, data should contain the (parsed) object. Also, replace the ? in the URL with callback (or whatever you named your function) - ? is not a valid identifier in JavaScript, so ?([....]) is nonsense.

Categories