投稿する前にすべての入力フィールドを入力する方法

Question

すべての入力フィールドをユーザーが送信する前に入力するようにします。入力フィールドが入力されるまで送信ボタンを無効にしようとしましたが、クライアント側で検証を試みましたが、動作させることはできませんでした。コードはパスしますが、すべてのフィールドが入力されてもボタンは使用できません。何らかの理由でボタンが引き続き無効になっています。

は私の_form.html.hamlは、次のようになります。

= simple_form_for @post, html: { multipart: true } do |f| 
    - if @post.errors.any? 
     #errors 
      %h2 
       = pluralize(@post.errors.count, "error") 
       prevented this Post from saving 
      %ul 
       - @post.errors.full_messages.each do |msg| 
        %li= msg 

    .form-group 
     = f.input :title,:label => "Project Name", input_html: { class: 'form-control', :type => "text", :required => "required", :autofocus => true} 
     %small#titleHelp.form-text.text-muted 

    .form-group 
     = f.input :image,:label => "Image", input_html: { class: 'form-group',"aria-describedby" => "fileHelp", :required => "required", :type => "file",:autofocus => true } 

    .form-group 
     = f.input :link,:label => "Project Link", input_html: { class: 'form-control', :type => "url", :value => "https://", :required => "required" , :autofocus => true, id:'url-input'} 


    .form-group 
     = f.input :description,:label => "Description", input_html: { class: 'form-control', :rows => "3", :required => "required" , :autofocus => true, id: 'description'} 
     %small#descriptionHelp.form-text.text-muted 


    %button.btn.btn-info{:type => "submit", :disabled => "disabled" } Add Project 

私は私のJSが何らかの理由で私のhtmlコードに接続されていないことを感じてapplication.js

$('#url-input, #description').on('blur keypress', function() { 
    var urlInputLength = $('#url-input').val().length; 
    var descriptionInputLength = $('#description').val().length; 
    if (urlInputLength == 0 || descriptionInputLength == 0) { 
    $('button').prop('disabled',true); 
    } else { 
    $('button').prop('disabled',false); 
    } 
}); 

でこれを試してみました。また、JSなしで動作させる方法が他にあるかどうかも疑問です。

ありがとうございます！

Answer 1

validates :attribute, presence: trueフォーム内のいずれかのフィールドに対応する属性のそれぞれについて。すべてのフィールドを入力せずにボタンをクリックすることはできますが、すべてのフィールドが入力されるまで同じページにリダイレクトされます。カスタムメッセージを追加することもできます。フィールドを入力せずに送信すると、入力する必要がある情報が表示されます。その後、すべてのフィールドが入力されると移動できます。