jQWidgets Forums
jQuery UI Widgets › Forums › Grid › Problem Export Json Date
This topic contains 1 reply, has 2 voices, and was last updated by Peter Stoev 11 years, 6 months ago.
-
AuthorProblem Export Json Date Posts
-
Hello!, i have a problem when try exporting columns that are date,ex: “2013-11-04T16:15:00.000Z”.
definition source:
{ name: ‘PROCES_FINISH’, type: ‘date’ , format: ‘dd-MM-yyyy HH:mm’}definition column:
{ text: ‘Date Finish’, datafield: ‘PROCES_FINISH’, columntype: ‘date’, filtertype: ‘date’, cellsformat: ‘dd-MM-yyyy HH:mm’, width: 150, cellsalign: ‘center’,editable:false}Method Export:
var data = $(“#grillaRegistroDetencionLineas{{divTab | raw}}”).jqxGrid(‘exportdata’, ‘JSON’);
Thx.
Hi,
Not sure what goes wrong on your side. May be the fact that the parameter’s name should be “json”, not “JSON”.
Here’s a working sample:
<!DOCTYPE html><html lang="en"><head> <title id='Description'>With jqxGrid, you can export your data to Excel, XML, CSV, TSV, JSON and HTML.</title> <link rel="stylesheet" href="../../jqwidgets/styles/jqx.base.css" type="text/css" /> <script type="text/javascript" src="../../scripts/jquery-1.10.1.min.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxcore.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxbuttons.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxscrollbar.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxmenu.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxcheckbox.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxgrid.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxgrid.selection.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxgrid.columnsresize.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxdata.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxdata.export.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxgrid.export.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxgrid.sort.js"></script> <script type="text/javascript" src="../../scripts/gettheme.js"></script> <script type="text/javascript" src="generatedata.js"></script> <script type="text/javascript"> $(document).ready(function () { var theme = getDemoTheme(); // prepare the data var data = generatedata(1); data[0].date = "2013-11-04T16:15:00.000Z"; var source = { localdata: data, datatype: "array", datafields: [ { name: 'firstname', type: 'string' }, { name: 'lastname', type: 'string' }, { name: 'productname', type: 'string' }, { name: 'available', type: 'bool' }, { name: 'date', type: 'date' }, { name: 'quantity', type: 'number' }, { name: 'price', type: 'number' } ] }; var dataAdapter = new $.jqx.dataAdapter(source); // initialize jqxGrid $("#jqxgrid").jqxGrid( { width: 670, source: dataAdapter, theme: theme, altrows: true, sortable: true, selectionmode: 'multiplecellsextended', columns: [ { text: 'First Name', datafield: 'firstname', width: 90 }, { text: 'Last Name', datafield: 'lastname', width: 90 }, { text: 'Product', datafield: 'productname', width: 177 }, { text: 'Available', datafield: 'available', columntype: 'checkbox', width: 67, cellsalign: 'center', align: 'center' }, { text: 'Ship Date', datafield: 'date', width: 190, cellsformat: 'dd-MM-yyyy HH:mm', align: 'right', cellsalign: 'right' }, { text: 'Quantity', datafield: 'quantity', width: 70, align: 'right', cellsalign: 'right' }, { text: 'Price', datafield: 'price', width: 65, cellsalign: 'right', align: 'right', cellsformat: 'c2' } ] }); $("#excelExport").jqxButton({ theme: theme }); $("#xmlExport").jqxButton({ theme: theme }); $("#csvExport").jqxButton({ theme: theme }); $("#tsvExport").jqxButton({ theme: theme }); $("#htmlExport").jqxButton({ theme: theme }); $("#jsonExport").jqxButton({ theme: theme }); $("#excelExport").click(function () { $("#jqxgrid").jqxGrid('exportdata', 'xls', 'jqxGrid'); }); $("#xmlExport").click(function () { $("#jqxgrid").jqxGrid('exportdata', 'xml', 'jqxGrid'); }); $("#csvExport").click(function () { $("#jqxgrid").jqxGrid('exportdata', 'csv', 'jqxGrid'); }); $("#tsvExport").click(function () { $("#jqxgrid").jqxGrid('exportdata', 'tsv', 'jqxGrid'); }); $("#htmlExport").click(function () { $("#jqxgrid").jqxGrid('exportdata', 'html', 'jqxGrid'); }); $("#jsonExport").click(function () { $("#jqxgrid").jqxGrid('exportdata', 'json', 'jqxGrid'); }); }); </script></head><body class='default'> <div id='jqxWidget' style="font-size: 13px; font-family: Verdana; float: left;"> <div id="jqxgrid"></div> <div style='margin-top: 20px;'> <div style='float: left;'> <input type="button" value="Export to Excel" id='excelExport' /> <br /><br /> <input type="button" value="Export to XML" id='xmlExport' /> </div> <div style='margin-left: 10px; float: left;'> <input type="button" value="Export to CSV" id='csvExport' /> <br /><br /> <input type="button" value="Export to TSV" id='tsvExport' /> </div> <div style='margin-left: 10px; float: left;'> <input type="button" value="Export to HTML" id='htmlExport' /> <br /><br /> <input type="button" value="Export to JSON" id='jsonExport' /> </div> </div> </div></body></html>
The resulting JSON from the above is:
[{"First Name":"Cheryl","Last Name":"Rossi","Product":"White Chocolate Mocha","Available":false,"Ship Date":"04-11-2013 18:15","Quantity":"2","Price":"$3.60"}]
Best Regards,
Peter StoevjQWidgets Team
http://www.jqwidgets.com -
AuthorPosts
You must be logged in to reply to this topic.