javascript CSV 読込み

前提・実現したいこと

jquery,javascriptどちらでもいいのですが、input type="file"
で選択したcsvを読み込みたいです。

https://qiita.com/yasumodev/items/cffb735f46ffd489a4db

上記URLを参考にしたのですが、console.logでどのようにCSVの中身を確認すればよろしいでしょうか。

発生している問題・エラーメッセージ

parsererror
No conversion from text to text/csv

該当のソースコード

javascript
1function file_upload(){
2   // フォームデータを取得
3   var formdata = new FormData($('#my_form').get(0));
4   // POSTでアップロード
5   $.ajax({
6       url  : "../index.php",
7       type : "POST",
8       data : formdata,
9       cache       : false,
10       contentType : false,
11       processData : false,
12       dataType    : "text/csv"
13   })
14   .done(function(data, textStatus, jqXHR){
15       alert(data);
16   })
17   .fail(function(jqXHR, textStatus, errorThrown){
18     console.log(jqXHR);
19     console.log(textStatus);
20     console.log(errorThrown);
21
22       alert("fail");
23   });
24}

html
1   <form id="my_form">
2            <input type="file" id="file" onchange="uv.style.display='inline-block'; uv.value = this.value;" />
3            <input type="text" id="uv" class="uploadValue" disabled />
4            <div id="result"></div>
5        </div>
6      </form>

試したこと

dataTypeをhtmlだとhtmlの内容がアラートで表示されたので
datatypeを変更しました。

maisumakun

2019/02/21 06:39

質問では「input type="file"で選択したcsvを読み込みたいです。」となっていますが、実際のコードはPHPに向けたアップロードになっています。単にブラウザ上で読むだけで、PHPへの送信は不要なのでしょうか、それともPHPで加工して表示したいということでしょうか（後者の場合、PHPのコードも提示していただくことになるかと思います）。

m.ts10806

2019/02/21 06:40

むしろ../index.phpでどのような処理をしているかの方が大事です。 PHPのほうもコードご提示願います。

退会済みユーザー

2019/02/21 07:24

すいません参照のコードと同じ内容になっておりまずはjavascript側で確認する必要があると思い、 PHP側の事を考えておりませんでした。PHPで加工を予定しております。

行動規範の内容に同意します

回答1件

ベストアンサー

とりあえずテキストファイルを読む方法だけ

javascript
1<script>
2$( function() {
3  $('#f1').on('change',function(){
4    var fr= new FileReader();
5    fr.addEventListener('load',function(e){
6      console.log(e.target.result);
7    });
8    fr.readAsText($(this).prop('files')[0], "utf-8");
9  });
10});
11</script>
12<input type="file" id="f1" accept=".csv">
13