jQWidgets Forums
jQuery UI Widgets › Forums › Grid › Export to XML
This topic contains 5 replies, has 2 voices, and was last updated by Nadezhda 10 years, 6 months ago.
-
AuthorExport to XML Posts
-
How can i change <table> to <Product> when i export to xml from jqxgrid?
Hello Huseyn,
Please, find the following example which contains possible solution for changing <table> to <Product>:
<!DOCTYPE html> <html lang="en"> <head> <title></title> <link rel="stylesheet" href="../../jqwidgets/styles/jqx.base.css" type="text/css" /> <script type="text/javascript" src="../../scripts/jquery-1.11.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/demos.js"></script> <script type="text/javascript" src="generatedata.js"></script> <script type="text/javascript"> $(document).ready(function () { // prepare the data var data = generatedata(2); 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: 850, height:200, source: dataAdapter, altrows: true, sortable: true, selectionmode: 'multiplecellsextended', columns: [ { text: 'First Name', datafield: 'firstname', width: 130 }, { text: 'Last Name', datafield: 'lastname', width: 130 }, { text: 'Product', datafield: 'productname', width: 200 }, { text: 'Available', datafield: 'available', columntype: 'checkbox', width: 67, cellsalign: 'center', align: 'center' }, { text: 'Ship Date', datafield: 'date', width: 120, align: 'right', cellsalign: 'right', cellsformat: 'd' }, { text: 'Quantity', datafield: 'quantity', width: 70, align: 'right', cellsalign: 'right' }, { text: 'Price', datafield: 'price', cellsalign: 'right', align: 'right', cellsformat: 'c2' } ] }); $("#xmlExport").jqxButton({ }); $("#xmlExport").click(function () { var gridXMLContent = $("#jqxgrid").jqxGrid('exportdata', 'xml'); gridXMLContent = gridXMLContent.replace('<table>', '<Product>'); gridXMLContent = gridXMLContent.replace('</table>', '</Product>'); alert(gridXMLContent); }); }); </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='margin-left: 10px; float: left;'> <input type="button" value="Export to XML" id='xmlExport' /> </div> </div> </div> </body> </html>
Best Regards,
NadezhdajQWidgets team
http://www.jqwidgets.com/But this code doesn`t export and I want delete <row> word. Please help
Hi Huseyn,
Here is an example which shows how to change ‘<table>’ to ‘<Product>’ and how to delete ‘<row>’ and ‘</row>’ from the string. You can see the result in alert when you click the export button. If you want to export grid’s data with these changes you should find a your own way for exporting.
<!DOCTYPE html> <html lang="en"> <head> <title></title> <link rel="stylesheet" href="../../jqwidgets/styles/jqx.base.css" type="text/css" /> <script type="text/javascript" src="../../scripts/jquery-1.11.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/demos.js"></script> <script type="text/javascript" src="generatedata.js"></script> <script type="text/javascript"> $(document).ready(function () { // prepare the data var data = generatedata(2); 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: 850, height: 200, source: dataAdapter, altrows: true, sortable: true, selectionmode: 'multiplecellsextended', columns: [ { text: 'First Name', datafield: 'firstname', width: 130 }, { text: 'Last Name', datafield: 'lastname', width: 130 }, { text: 'Product', datafield: 'productname', width: 200 }, { text: 'Available', datafield: 'available', columntype: 'checkbox', width: 67, cellsalign: 'center', align: 'center' }, { text: 'Ship Date', datafield: 'date', width: 120, align: 'right', cellsalign: 'right', cellsformat: 'd' }, { text: 'Quantity', datafield: 'quantity', width: 70, align: 'right', cellsalign: 'right' }, { text: 'Price', datafield: 'price', cellsalign: 'right', align: 'right', cellsformat: 'c2' } ] }); $("#xmlExport").jqxButton({}); $("#xmlExport").click(function () { var gridXMLContent = $("#jqxgrid").jqxGrid('exportdata', 'xml'); gridXMLContent = gridXMLContent.replace('<table>', '<Product>'); gridXMLContent = gridXMLContent.replace('</table>', '</Product>'); var removeRows = '<row>|</row>'; var re = new RegExp(removeRows, 'gi'); gridXMLContent = gridXMLContent.replace(re, ''); alert(gridXMLContent); }); }); </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='margin-left: 10px; float: left;'> <input type="button" value="Export to XML" id='xmlExport' /> </div> </div> </div> </body> </html>
Best Regards,
NadezhdajQWidgets team
http://www.jqwidgets.com/I need export. It doesn`t export
Hi Huseyn,
If you want to use the above changes you should find your own way for exporting. Otherwise you can find the following demo which shows how to export data to XML: http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxgrid/dataexport.htm?arctic.
Best Regards,
NadezhdajQWidgets team
http://www.jqwidgets.com/ -
AuthorPosts
You must be logged in to reply to this topic.