ボタンから.txtファイルの取得

一覧カスタマイズHTMLで

<input type=“file” id=“files”>

を記述し、設置したinputボタンから.txtファイルを読み込みたいと思い、試しにアラートの出力ができるかチェックしてみました。

 

サンプルコードを元に下記コードを記述しました。

const inputFiles = document.getElementById(‘files’);

inputFiles.addEventListener(‘change’ , (event) => {

   if (event.target.files[0] === ‘text/plain’){

      window.confirm(“.txtファイルが読み込まれました”);

   }else{

      window.alert(“.txtファイルではありません”);

      }

});

 

しかし、jsfiddle.netではアラートやログの出力も問題なく行えていたのですが、

kintoneアプリだとファイルを選択してもアラートすら出現しませんでした。

アラートが出力されないということはファイルの取得がそもそもできていないとは思うのですが、他アプリでは問題なく行えていたためにどこを修正すればよいのかがわからい状況です。

そちらがコードの全文ですか?即時関数の形でapp.record.index.show(レコードの一覧表示イベント)の中で記述されていますか?以下で動作確認できています。

また、ファイルの形式を判定するのはfiles[0].typeになると思われます。kintoneの一覧画面で使用する場合、指定した一覧以外では実行しないようにevent.viewId(一覧のID)またはevent.viewName(一覧の名前)を追加した方が良いでしょう。

(() => {
    'use strict';

    kintone.events.on('app.record.index.show', (event) => {
      if (event.viewId === /* 一覧のIDを数字で入力 */) {
            const inputFiles = document.getElementById('files');

            inputFiles.addEventListener('change' , (event) => {
                if (event.target.files[0].type === 'text/plain'){
                    window.confirm(".txtファイルが読み込まれました");
                } else {
                    window.alert(".txtファイルではありません");
                }
            });
        }

        return event;
    });
})();

mls-hashimoto 様

 

ご回答いただき感謝いたします。

初歩的なことですが、即時関数内で記述しておりませんでした。

それから.typeを付け加えて記述したところ、こちらでも問題なくアラート処理が実行されました。

ご指摘ありがとうございました。

このトピックはベストアンサーに選ばれた返信から 3 日が経過したので自動的にクローズされました。新たに返信することはできません。