DHTMLX Docs & Samples Explorer

Import/export from/to CSV

Serialization to CVS is possible in dhtmlxGrid. You can choose which delimiter to use.

Use as delimiter:
  • Tab - \t
  • Comma - ,
  • Other
  • Load from CSV

  • Load Grid from CSV (content of textarea below)

  • Source
    <link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxgrid.css">
    <link rel="stylesheet" type="text/css" href="../../codebase/skins/dhtmlxgrid_dhx_skyblue.css">
    <script  src="../../codebase/dhtmlxcommon.js"></script>
    <script  src="../../codebase/dhtmlxgrid.js"></script>
    <script  src="../../codebase/ext/dhtmlxgrid_nxml.js"></script>
    <script  src="../../codebase/dhtmlxgridcell.js"></script>
     
     
    <script>
    function serilaizeToCSVWithDelim(delim) {
        mygrid.setCSVDelimiter(delim);
        document.getElementById('ser_1').value = mygrid.serializeToCSV();
    }
    </script> <table width="800" cellspacing="0" cellpadding="0"> <tr> <td valign="top"> <div id="gridbox" style="width:600px; height:270px; background-color:white;"></div> </td> </tr> <tr> <td valign="top" width="400px"> Use as delimiter:<br> <li hrei><a href="javascript:void(0)" onClick="serilaizeToCSVWithDelim('\t')">Tab</a> - \t</li> <li><a href="javascript:void(0)" onClick="serilaizeToCSVWithDelim(',')">Comma</a> - ,</li> <li><a href="javascript:void(0)" onClick="serilaizeToCSVWithDelim(document.getElementById('serdelim').value)">Other</a> <input id="serdelim" size="1" maxlength="1"></li> <li><a href="javascript:void(0)" onClick="mygrid.clearAll();mygrid.loadCSVString(document.getElementById('ser_1').value)">Load Grid from CSV (content of textarea below)</a></li> </td> </tr> </table> <textarea style="font-size:8pt; font-family:Arial; width:800px; height:150px;" id="ser_1"></textarea> <br> <script>
    mygrid = new dhtmlXGridObject('gridbox');
    mygrid.setImagePath("../../codebase/imgs/");
    mygrid.setHeader("Sales,Book Title,Author,Price,In Store,Shipping,Bestseller,Date of Publication");
    mygrid.setInitWidths("50,150,100,80,80,80,80,200");
    mygrid.setColAlign("right,left,left,right,center,left,center,center");
    mygrid.setColTypes("dyn,ed,ed,price,ch,co,ra,ro");
    mygrid.getCombo(5).put(2, 2);
    mygrid.init();
    mygrid.setSkin("dhx_skyblue");
    mygrid.enableCSVAutoID(false);
    mygrid.loadCSVFile("../common/grid.csv");
    </script>