當使用javascript驗證使用form_tag時的輸入字段時，提交按鈕在rails中停止工作

Question

我正在對視圖頁本身進行驗證，因爲我沒有將其存儲在數據庫中。因此，我無法爲此使用模型驗證。我不得不資源使用JavaScript來檢查驗證，以確保用戶沒有提交錯誤的值或提交所需的空字段。這確實可以防止用戶提交錯誤的輸入，但是在錯誤提示框彈出之後，由於某種原因它會禁用提交按鈕，並且用戶無法修復他的錯誤並嘗試再次提交。

feedback.html.erb

<script> 
    function validateForm() { 

    if (document.forms["myForm"]["name"].value == null || document.forms["myForm"]["name"].value == "") { 
     alert("Name must be filled out"); 
     return false; 
    } 
    if (document.forms["myForm"]["message"].value == null || document.forms["myForm"]["message"].value == "") { 
     alert("Message must be filled out"); 
     return false; 
    } 
    var x = document.forms["myForm"]["email"].value; 
    var atpos = x.indexOf("@"); 
    var dotpos = x.lastIndexOf("."); 
    if (atpos < 1 || dotpos < atpos+2 || dotpos+2 >= x.length) { 
     alert("Not a valid e-mail address"); 
     return false; 
    } 
    } 
</script> 
<div class="container"> 
    <div class="container-content"> 
    <%= form_tag send_feedback_forms_path, name:'myForm', onsubmit:'return validateForm()' do %> 
     <%= label_tag 'name', 'Name:', class: 'control-label' %> 
     <%= text_field_tag 'name', nil, placeholder: 'Enter Your Name', class:'form-control' %> 
     <%= label_tag 'text', 'Email:', class: 'control-label'%> 
     <%= email_field_tag 'email', nil, placeholder: 'Enter Your Email', class:'form-control' %> 
     <%= label_tag 'phone', 'Phone:', class: 'control-label'%> <span style="font-size: small; color: red">(optional*)</span> 
     <%= phone_field_tag 'phone', nil, placeholder: 'Enter Your Phone Number', class:'form-control' %> 
     <%= label_tag 'message', 'Message:', class: 'control-label' %> 
     <%= text_area_tag 'message', nil, placeholder: 'Enter Your Message', class:'form-control' %><br> 
     <%= submit_tag 'Submit', class: 'btn-primary' %> 
    <% end %> 
    </div> 
</div> 

Answer 1

你訴諸JavaScript中的全部原因是基於因爲他們沒有被保存到數據庫中，你不能用模型的前提所以我感到不得不給你一個Rails的選擇。你想要做的是設置一個「表單模型」。這允許你使用所有的Rails魔術而不需要任何表格支持的數據。所有這些都需要創建一個類，添加一些虛擬屬性，然後包括一些Rails模塊，這樣你就可以輕鬆完成任務。下面的例子：

#app/models/new_user.rb 
class NewUser 
    include ActiveModel::Model #This gives you validations and all the rails magic a standard table backed model would 
    attr_accessor :email #This gives you read&write methods for your virtual attribute 
    attr_accessor :username 

    validates :username, :email, presence: true #standard rails validations 

    def initialize(params={}) 
     self.username = params[:username] 
     self.email = params[:email] 
    end 
end 

現在在你的控制器，你需要實例化視圖的對象：

def new 
     @new_user = NewUser.new 
    end 

然後在表單提交的動作，因爲你不堅持任何數據你只需檢查它是否有效：

def create 
    @new_user = NewUser.new(email: params[new_user][:email], username: params[:new_user][:username]) 
    if @new_user.valid? 
      #passed validation so do whatever 
    else 
    #flash some errors etc 
    end 
end 

隨着您繼續開發更大的Rails應用程序，您會注意到一個模型可能不得不在不同的頁面上處理多種不同的表單，所有這些表單都需要不同數量的數據。在這一點上，處理一種模型的所有不同形式的所有驗證都將成爲一場災難。上面的方法將允許您按表單的形式組織您的代碼，不受限制。