CSVファイルを$.ajaxで読込み、配列に変換する

CSVファイルもjQueryの$.ajaxメソッドを使ってサーバから読み込むことができる。
その方法は次のとおりである。

$(function(){
  $('#btn').click(function(){
    // CSV形式のファイルを読み込み
    $.ajax({
      url:'csvname2.csv', 
      type:'get',
      dataType:'text',     // CSV形式のデータを受信
      cache:false,
      success: function(csv){ 
        var rows = $.csv()(csv);    // CSVを配列に変換
        // <table>,<th>,<td>の生成と表示
        var table = $('<table>').appendTo(document.body);
        $.each(rows,function(rIdx,row){
          var tr = $('<tr>').appendTo(table);
          $.each(row,function(cIdx,column){
            if(rIdx == 0){
              $('<th>',{text:column}).appendTo(tr);
            }else{
              $('<td>',{text:column,css:{textAlign:isNaN(column) ? 'left' : 'center'}}) 
              .appendTo(tr);
            }
          });
        });
      }
    });
  });
});

url:にてCSVファイルを指定し、dataType:でtextを指定する。

読み込んだ後はCSVを配列に変換する。変換はjQueryプラグインがあったので利用させて頂いた。
プラグインのソースコード(これを使いやすいようにjquery.csv.jsにしておく)

/* Usage:
 *  jQuery.csv()(csvtext)  returns an array of arrays representing the CSV text.
 *  jQuery.csv("\t")(tsvtext)  uses Tab as a delimiter (comma is the default)
 *  jQuery.csv("\t", "'")(tsvtext) uses a single quote as the quote character instead of double quotes
 *  jQuery.csv("\t", "'\"")(tsvtext) uses single & double quotes as the quote character
 *  jQuery.csv(",", "", "\n")(tsvtext) カンマ区切りで改行コード「\n」
 */
jQuery.extend({
 csv: function(delim, quote, lined) {
  delim = typeof delim == "string" ? new RegExp( "[" + (delim || ","   ) + "]" ) : typeof delim == "undefined" ? ","    : delim;
  quote = typeof quote == "string" ? new RegExp("^[" + (quote || '"'   ) + "]" ) : typeof quote == "undefined" ? '"'    : quote;
  lined = typeof lined == "string" ? new RegExp( "[" + (lined || "\r\n") + "]+") : typeof lined == "undefined" ? "\r\n" : lined;

  function splitline (v) {
   // Split the line using the delimitor
   var arr  = v.split(delim), out = [], q;
   for (var i=0, l=arr.length; i<l; i++) {
    if (q = arr[i].match(quote)) {
     for (j=i; j<l; j++) {
      if (arr[j].charAt(arr[j].length-1) == q[0]) {
       break;
      }
     }
     var s = arr.slice(i,j+1).join(delim);
     out.push(s.substr(1,s.length-2));
     i = j;
    }
    else {
     out.push(arr[i]);
    }
   }

   return out;
  }

  return function(text) {
   var lines = text.split(lined);
   for (var i=0, l=lines.length; i<l; i++) {
    lines[i] = splitline(lines[i]);
   }
   
   // 最後の行を削除
   var last = lines.length - 1;
   if (lines[last].length == 1 && lines[last][0] == "") {
    lines.splice(last, 1);
   }
   
   return lines;
  };
 }
});

変換の使い方は次のとおりである。

var rows = $.csv()(csvデータ);

上記の例はCSVデータがrowsに二次元配列で変換される。