Javascript loading CSV file into an array

Question

I am developing a web page in Wordpress. The webpage needs to have a combobox with all counties. I have a dataset in csv format which has some 10k rows for all these counties. When the user selects a county in the dropdown, I want only the selected county data displayed in the web page. This is my requirement. In wordpress, my web page I am adding the js file using ``` ``` and the code for webpage dropdown is ``` ``` In countyList1.js file I have the setCounties() and getSelectedCountyData() functions. So far I can see the dropdown with counties list. I don't know how to read the CSV file and apply the selected county filter to this list. I tried the FileReader object and I can load the CSV contents on the web page but I don't want the user to select the CSV. I have the dataset alread…

Accepted Answer

I highly recommend looking into this plugin:

http://github.com/evanplaice/jquery-csv/

I used this for a project handling large CSV files and it handles parsing a CSV into an array quite well. You can use this to call a local file that you specify in your code, also, so you are not dependent on a file upload.

Once you include the plugin above, you can essentially parse the CSV using the following:

```
$.ajax({
    url: "pathto/filename.csv",
    async: false,
    success: function (csvd) {
        data = $.csv.toArrays(csvd);
    },
    dataType: "text",
    complete: function () {
        // call a function on complete 
    }
});
```

Everything will then live in the array data for you to manipulate as you need. I can provide further examples for handling the array data if you need.

There are a lot of great examples available on the plugin page to do a variety of things, too.

Javascript loading CSV file into an array

Solution

Problem

Related problems