質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.45%
CSV

CSV(Comma-Separated Values)はコンマで区切られた明白なテキスト値のリストです。もしくは、そのフォーマットでひとつ以上のリストを含むファイルを指します。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

Q&A

解決済

1回答

402閲覧

javascript CSV 読込み

退会済みユーザー

退会済みユーザー

総合スコア0

CSV

CSV(Comma-Separated Values)はコンマで区切られた明白なテキスト値のリストです。もしくは、そのフォーマットでひとつ以上のリストを含むファイルを指します。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

0グッド

0クリップ

投稿2019/02/21 06:36

前提・実現したいこと

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を変更しました。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

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で加工を予定しております。
guest

回答1

0

ベストアンサー

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

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

受けたデータをcsvにパースしないといけませんが、これは
自力でやるのは面倒なので適当なパーサーをネットで探してください

投稿2019/02/21 06:54

yambejp

総合スコア115061

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

退会済みユーザー

退会済みユーザー

2019/02/22 07:27

回答ありがとうございます。 単純にidでファイルオブジェクトを取得してFileReaderを使用する事で読み込む事は出来ました。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.45%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問