9

私は、一連のテキストファイルからデータを読み取り、それをMySQLデータベースにマップするWebアプリに取り組んでいます。

現在、フォームではファイルパスを手動で入力する必要がありますが、セットアップのその部分を少し面倒にするために、このフィールドにファイルチューザーを追加したいと思います。

私が見つけたソリューションはすべて単一のファイルを選択できますが、ほとんどのジョブでは一度に複数のファイルをサーバーからプルする必要があるため、入力パターンを使用できるソリューションを探しています。

この件での助けは大歓迎です。

4

1 に答える 1

14

多くの検索といくつかの回避策が必要でしたが、私はこれに対してかなり実行可能な答えを見つけました。

私が直面した最大の問題は、サーバー側のファイルを参照することでした。その問題を解決するjQueryプラグインをABeautifulSiteで見つけました。

これは、JSP、PHP、ASPなどのサーバー側コネクタスクリプトを備えたAJAXファイルブラウザです。

次のスクリプトを使用して、Webアプリケーションのファイルツリーを構築しました。

  $(document).ready( function() {
    $('#loadFolderTree').fileTree({

        root: '/server_root/subfolder/tree_root',
        script: '/js/jquery_file_tree/connectors/jqueryFileTree.jsp',
        multiFolder: false,

    });    
  });

このスクリプトの良いところは、選択したファイルパスを文字列として返すことです。スクリプトのデフォルトのファイル処理にいくつかのマイナーな追加を加えて、次のコードを使用して、返されたファイルパスを適切なフォームフィールドに書き込むことができました。

}, function(file) {
            var loadPat = document.getElementById("loadPattern");
            loadPat.value = file.replace("/server_root/subfolder/tree_root/", "");

フォームはルートに関連するファイルを処理するようにすでに構築されているため、パス全体を出力する必要はありません。この最後のコードは、ルートディレクトリまでのパスを削除し、フォームの値をの残りのコンテンツに設定します。文字列。

最も重要なことは、返された文字列は、ユーザーがinput-file-1.txtの戻り値をinput-file * .txtに変更し、1回の実行で複数のファイルをインポートできる形式で編集できることです。

これが最終結果です。

  $(document).ready( function() {
    $('#loadFolderTree').fileTree({

        root: '/server_root/subfolder/tree_root',
        script: '/js/jquery_file_tree/connectors/jqueryFileTree.jsp',
        multiFolder: false,

    }, function(file) {
        var loadPat = document.getElementById("loadPattern");
        loadPat.value = file.replace("/server_root/subfolder/tree_root/", "");

    });    
  });
于 2012-02-03T16:21:30.327 に答える