javascriptarrayscsvdata-objects

read cells content of dataobject


I read a csv file using javascript code and i want to push it into a a 2D Array in order to do some processing

var dataArray = new Array;
        function parseCSV(dataArray) {
            //replace UNIX new lines
            data = data.replace(/\r\n/g, "\n");
            //replace MAC new lines
            data = data.replace(/\r/g, "\n");
            //split into rows
            var rows = data.split("\n");

            // loop through all rows
            for (var i = 0; i < rows.length; i++) {
                // this line helps to skip empty rows
                if (rows[i]) {
                    // our columns are separated by comma
                    var column = rows[i].split(",");


                    var date=column[0];
                    var value = column[4];

                    // create object which contains all these items:
                    var dataObject = {
                        date: date,
                        T4: value 
                    };  
                   dataArray.push(dataObject);
                }
            }   
        } 
        }

As a test, i try to read a cell content and display on the web page to verify that i read the file.

<script type="text/javascript">
       var x= dataArray[1][4];
        document.write(x);
    </script>

but it doesn't show anything. Can anyone Help??


Solution

  • var dataArray = new Array;
    
    var data = "Date,Description,Created By,Modified By,T4 Tag\n";
    data += "20170424,This is record 1,user1,none,Just work please.\n";
    data += "20170424,This is record 2,user2,none,I'm trying too.\n";
    
    function parseCSV(dataArray) {
        //replace UNIX new lines
        data = data.replace(/\r\n/g, "\n");
        //replace MAC new lines
        data = data.replace(/\r/g, "\n");
        //split into rows
        var rows = data.split("\n");
    
        // loop through all rows
        for (var i = 0; i < rows.length; i++) {
            // this line helps to skip empty rows
            if (rows[i]) {
                // our columns are separated by comma
                var column = rows[i].split(",");
    
    
                var date=column[0];
                var value = column[4];
    
                // create object which contains all these items:
                var dataObject = {
                    date: date,
                    T4: value 
                };  
               dataArray.push(dataObject);
            }
        }   
    } 
    parseCSV(dataArray);
    

    Lacking a file, I forced some CSV data into a string for processing. Your question is not showing these two items:

    1. how you are setting var data
    2. how you are calling parseCSV(dataArray)

    If these two things are present all should work - Here's the proof


    As far as the html script portion:

    your array addressing looks wrong - it seems like it should look like:

    <script>
      var x = dataArray[1].T4;
      document.write(x);
    </script>
    

    Here's my reasoning:

    I understand that you are passing the CSV data to this function for parsing it into your dataArray variable - correct?

    If correct, this data will look something like I have added manually (I added this directly just to work with something).

    The bigger item is not so much where the data is coming from, but that ultimately it gets parsed by this parseCSV function.

    When this happens, you are building appending to the empty dataArray variable in the following way:

    For the first pass this will look as follows:

    [{"date" : "Date", "T4" : "T4 Tag"}]

    For the second pass:

    [{"date" : "Date", "T4" : "T4 Tag"}, {"date" : "20170424", "T4" : "Just work please."}]

    For the third pass:

    [{"date" : "Date", "T4" : "T4 Tag"}, {"date" : "20170424", "T4" : "Just work please."}, {"date" : "20170424", "T4" : "I\'m trying too."}]

    So now when you are in your html section of code, you have no key of address [4].

    Your code says:

    var x = dataArray[1][4];
    

    Consider the following to see what I mean:

    var record = dataArray[1];
    //{"date" : "20170424", "T4" : "Just work please."}
    //There is no key 4 here only date & T4.
    var date = record.date;//returns: "20170424"
    var t4 = record.T4;//returns: "Just work please."
    

    In Contrast if you had the following - your method would work

    myObj = {"date" : "20170424", "4" : "This is a value for field 4", "T4" : "Just work please."}
    myObj[4];//returns "This is a value for field 4";
    

    hopefully this explains it clearly enough.