1

次のように、railsfile_fieldタグを使用してファイルをアップロードしています。

<%= f.file_field :image, :class => 'file_field' %>

いくつかのcss回避策を使用して、ファイルをアップロードするためのボタンを作成しました（すべてクリック可能です）。

ここに画像の説明を入力してください

ユーザーがボタンをクリックしてファイルを選択した後、ユーザーがフォームを送信する前に、アップロードするファイルが選択されたことをユーザーに示したいと思います。そうしないと、ユーザーはファイルが選択されていることに気付かないでしょう。

ユーザーにそのような指示を与えることができるように、（RailsまたはJavascriptイベントハンドラー内にあるかどうかにかかわらず）どのような方法を使用できますか？

4

1 に答える 1

1

これでうまくいくはずです。それはjQueryにありますが、そのままのJavaScriptを使用するように変換することはそれほど難しくありません

最初: ファイル入力のある HTML:

<div>
  Click to upload a file. <input type="file" id="fileUploader" />
  <br />
  <span id="fileName"><em>No File Chosen Yet</em></span>
</div>

今JavaScript：

<script type="text/javascript">

//bind to change event to determine when user chooses a file to upload
$("#fileUploader").bind("change", function (e)
{
    //get the file path
    var file = $("#fileUploader").val();

    //pull out the filename
    file = file.replace(/^.*\\/i, "");

    //show to user
    $("#fileName").html("You chose: " + file);
});

</script>
于 2012-06-06T05:06:35.320 に答える