Ruby on Railsでfile_field_tagがヌルでない限り、サブミットボタンを無効にします

Question

私はフォームを持っていて、そのフォームにsubmit_tagとfileフィールドタグがあります。ユーザーがファイルを選択しない限り、送信ボタンは無効にする必要があります。 file_field_tagが満たされたら、ボタンを有効にする必要があります。これを行う最善の方法は何ですか？

これは私のコードです：事前に

<% form_tag({:action => 'match'}, {:multipart => true, :id => 'file_form_id'}) do %> 


     <%= file_field_tag 'file', :size => 500%></p> 

     <%= submit_tag 'Submit' -%> 


<% end -%> 

ありがとう！

Answer 1

あなたはjavascriptを使ってそのクライアント側を行う必要があります。最初に無効にしたボタンを設定し、入力フィールドが変更されたときに実行されるクライアントサイドのメソッドを持っています。このメソッドは、値があるかどうかをチェックし、ボタンを有効にします。私はjQuery経由で控えめなjsを使用したいと思います。

Answer 2

私はあなたの質問に答えていないことを知っていますが、ここで私は同じ問題を解決しました。私はそれを使用して、コントローラのメソッド内のファイルの存在をチェックしています：

def import 
    if params[:file].nil? 
    redirect_to some_model_url, alert: "CSV document not present." 
    else 
    ModelName.import(params[:file]) 
    redirect_to some_model_url, notice: "Model Name collection imported." 
    end 
end 

Answer 3

私はfile_field_tagに「変更」イベントハンドラをバインドするjQueryの（またはプレーンJS）を使用します。 ファイルが存在するかどうかを確認するには、file_field_tagでjQueryの.val（）関数を使用します。以下のコード例：

<%= form_tag(import_substitutions_path, :method => :post, multipart: true) do %> 
 
    <%= file_field_tag 'file-field' %> 
 
    <%= submit_tag "Import CSV", disabled: true, id: 'csv-import-submit' %> 
 
    <% end %> 
 

 
<script> 
 
    var csvField = $('#file-field'); 
 
    var submitButton = $('#csv-import-submit'); 
 
    $(csvField).change(function() { 
 
    var fileValue = $(csvField).val(); 
 
    if (fileValue.empty()) { 
 
     $(submitButton).attr("disabled", true); 
 
    } else { 
 
     $(submitButton).attr("disabled", false); 
 
    } 
 
    }) 
 
</script>

は、私は、単にfile_field_tagにrequired: trueオプションを追加することの代替ソリューション提案するかもしれません：

<%= file_field_tag 'file-field', required: true %>