I want to import csv file in data table .

Webix JS
1

I done below coding but not coming browse button and its showing error in last line please do the needful.


grid = new webix.ui({
    view: "datatable",
    columns: [
        { id: "data0", header: "Country", width: 250},
        { id: "data1", header: "Population", width: 200},
        { id: "data2", header: "Year", width: 100}
    ],
    autoheight: true,
    autowidth: true,
    datatype: "csv"
});


function handleFileSelect(e) {

    var fileList = e.target.files;
    var file = fileList[0];

    var reader = new FileReader();
    reader.readAsText(file);

    // Closure to capture the file information.
    reader.onload = (function (theFile) {

        var fileData = theFile.target.result;
        grid.parse(fileData, 'csv'); // loads the data to datatable
    })
}

document.getElementById('fileUpload').addEventListener('change', handleFileSelect, false);
2

Hi

Your problem occurs because the last line is executed before the html file is fully loaded and therefore the fileUpload-id couldn’t be found. To fix this problem surround your code with the ready function.

Here’s a fully working example.

3

Hi Dillinger,

Thank for your active participation in forum life. We appreciate you help very much.