Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

JSON input not working #177

Closed
mrbladergroen opened this issue Jun 29, 2018 · 5 comments
Closed

JSON input not working #177

mrbladergroen opened this issue Jun 29, 2018 · 5 comments

Comments

@mrbladergroen
Copy link

@mrbladergroen mrbladergroen commented Jun 29, 2018

JSON input does not seem to work. I can get jEXCEL to work with an array: $('#myTable').jexcel({ data:[['bar1',['bar2']] }), but JSON input gives me empty cells: $('#myTable').jexcel({ data:[{'foo1':'bar1'},{'foo1':'bar2'}] }).
Same when I try to get my JSON data from an external file.

@paulhodel

This comment has been minimized.

Copy link
Owner

@paulhodel paulhodel commented Jun 29, 2018

The correct way if is a json to convert it first and use setData as below:

$('#myTable').jexcel('setData', data); // Data as a JS array.

@paulhodel paulhodel closed this Jun 29, 2018
@mrbladergroen

This comment has been minimized.

Copy link
Author

@mrbladergroen mrbladergroen commented Jul 10, 2018

I still would like to comment on this: You have included JSON into the possibilities of data import when an url is added to the jExcel initiation:

$('#my').jexcel({
    // The URL from your data file in JSON format.
    url:'/jquery/json'
});

A JSON array contains keys and values, the array to import the data only contains values. That's probably why jExcel is 'tripping' over a JSON array: it does not know what to do with the keys. Also, the page I am getting the JSON data from is not just a JSON object, but a php file generating JSON data. This php file need some information that I post in order to generate the correct data. I might be wrong, but posting data is not possible in the current version of jExcel. If I check your code I don't see a 'data' option in your ajax call:

else if (options.url) {
            // Load json external file
            $.ajax({
                id: id,
                url: $.fn.jexcel.defaults[id].url,
                **data: postData, //this part is missing**
                dataType:'json',
                success: function (result) {
                    // Data
                    $.fn.jexcel.defaults[this.id].data = (result.data) ? result.data : result;
                     // Prepare table
                    $.fn.jexcel('prepareTable', this.id);
                }
            });
        }

...

So I use my own ajax call and on succes I generate a jExcel table. Apart from that I created a function to convert the JSON data into an array with only values ( jExcelExtensions.convertJSONdata() ):

$.ajax({
				type: 'POST',
       				url: '../" .$_POST['database'] ."/" .$_POST['database'] ."_base.php',
       				data: sendarray,
       				success: function(responseText) {
       					var dat = $.parseJSON(responseText);
       					var headrs = new Array();
       					var widths = new Array();
       					for (var prop in dat[0]) {
       						if (dat[0].hasOwnProperty(prop)) {
        	    					headrs.push(prop);
        	    					widths.push(0.8* prop.length * parseFloat($('#sampleTable').css('font-size')) + 'px');
        					};
        				}
        				$('#sampleTable').jexcel({ data:jExcelExtensions.convertJSONdata(dat), colHeaders: headrs, colWidths: widths, tableOverflow:true });
       				}
			});

What I would like to see is this posting of data directly to jExcel, something like this:

$('#my').jexcel({
    // The URL from your data file in JSON format.
    url:'/jquery/json',
    data: postData
});

This way I can skip my own ajax call which will make the code a lot easier and clearer.

I also would like to have the option to use the keys from a JSON object as headers in the table by default when no headers are defined.

@soko3011

This comment has been minimized.

Copy link

@soko3011 soko3011 commented Oct 1, 2019

any chance you can post this extension - jExcelExtensions.convertJSONdata()?

@mrbladergroen

This comment has been minimized.

Copy link
Author

@mrbladergroen mrbladergroen commented Oct 4, 2019

any chance you can post this extension - jExcelExtensions.convertJSONdata()?

Put this code into the 'jexcel\dist\js\jquery.jexcel.extension.js' file:

var jExcelExtensions = {
    convertJSONdata : function (jsn) {
        var jArray = new Array(), i = 0, prop;
        for (i = 0; i < jsn.length; i++) {
 	    var v = new Array();
            for (prop in jsn[i]) {
                if (jsn[i].hasOwnProperty(prop)) {
                    if (typeof jsn[i][prop] === "string") {
                        v.push('"' + jsn[i][prop] + '"');
                    }
                    else {
                        v.push(jsn[i][prop]);
                    }
                }
            }
            jArray.push('[' + v + ']');
        }
        return '[' + jArray + ']';
    },
    ...
}
@soko3011

This comment has been minimized.

Copy link

@soko3011 soko3011 commented Oct 4, 2019

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Linked pull requests

Successfully merging a pull request may close this issue.

None yet
3 participants
You can’t perform that action at this time.