Javascript 保存Rails之前的验证

我想在保存前进行验证，确定用户是否在提交表单之前填写了特定字段、下面的“付款金额”字段并选择了status=“Closed”。如果他做了一个而没有另一个，那么表单就不应该保存

编辑页面

<%= simple_form_for @invoice, :html => { :class => 'form-horizontal' } do |f| %>
<%= render "shared/error_messages", :target => @invoice %>

<%= f.association :customer, disabled: @invoice.persisted? %>
<%= f.input :due_date, as: :string, input_html: { class: "datepicker" }, disabled:  @invoice.persisted? %>
<%= f.input :invoice_date, as: :string, input_html: { class: "datepicker" }, disabled: @invoice.persisted? %>
<%= f.input :payment_method, as: :select, :collection => [['Cash','Cash'],['Cheque','Cheque'],['In-House transfer','In-House transfer'],['Account Ledger','Account ledger']], :selected => ['Cash','Cash'] %>
<%= f.input :reference_no, :label => 'Payment Reference No', as: :string %>
<%= f.input :amount, as: :string %>
<%= f.input :payment_date, as: :string, input_html: {class: "datepicker"} %>
<%= f.input :status, as: :select, collection: Invoice::VALID_STATUS %>

{:class=>'form horizontal'}do | f |%>
@发票%>
[['Cash'、'Cash']、['check'、'check']、['In-House transfer'、'In-House transfer']、['Account Ledger'、'Account Ledger']]，：所选=>['Cash'、'Cash']%>
“付款参考号”，如：：字符串%>

Invoice.rb中的有效_状态=['草稿'、'打开'、'关闭'、'作废']

我希望如果用户将状态更改为Closed，他应该在表单中输入金额。如果不在模型（

app/models/invoice_model.rb

）中输入金额，用户应无法将状态更改为“已关闭”

然后定义它（同一文件）

要在客户端应用模型级验证，您可以使用
在模型中（

app/models/invoice\u model.rb

）放置

然后定义它（同一文件）

要在客户端应用模型级验证，您可以使用
1）Javascript表单验证通常按名称进行

 function ValidateForm(){
     var form = document.forms['myForm'];
     if ((form['status'].value == "Closed") && !(form['amount'].value)){
         alert("You gave a 'Closed' status value, but did not provide an amount, please rectify this problem!");
         return(false);
     } else {
        return(true);
     }
 }

然后：

         <%= simple_form_for @invoice, :onsubmit => "ValidateForm();", :html => { :class => 'form-horizontal', :name => 'myForm' } do |f| %>
         <%= f.input :amount, :html => { :name => 'amount'}, as: :string %>
         <%= f.input :status, as: :select, :html => { :name => 'status'}, collection: Invoice::VALID_STATUS %>

“ValidateForm（）；”，：html=>{:class=>'form horizontal'，：name=>'myForm'}do | f |%>
{:name=>amount'}，as:：string%>
{:name=>'status'}，集合：Invoice:：VALID\u status%>

提交表单时，在表单实际发布到服务器之前，将触发一个简短的演练

onSubmit

由事件触发并以

return（false）终止的javascrtipt函数

将立即终止事件，而

返回（true）（或者几乎所有其他的东西）使活动按计划继续进行

最后，请注意，完全依赖客户端验证是一个糟糕的想法，因为有决心的用户可能会执行以下操作：

1） 在firebug打开的情况下进行完全合法的提交，并检查标题等。

2） 创建自己的HTTP请求，其中包含虚假/错误数据。

3） 通过各种HTTP工具中的任何一种提交它

客户端验证是一个“好东西”。
服务器端验证是“必须具备的”。
1）Javascript表单验证通常按名称进行

 function ValidateForm(){
     var form = document.forms['myForm'];
     if ((form['status'].value == "Closed") && !(form['amount'].value)){
         alert("You gave a 'Closed' status value, but did not provide an amount, please rectify this problem!");
         return(false);
     } else {
        return(true);
     }
 }

然后：

         <%= simple_form_for @invoice, :onsubmit => "ValidateForm();", :html => { :class => 'form-horizontal', :name => 'myForm' } do |f| %>
         <%= f.input :amount, :html => { :name => 'amount'}, as: :string %>
         <%= f.input :status, as: :select, :html => { :name => 'status'}, collection: Invoice::VALID_STATUS %>

“ValidateForm（）；”，：html=>{:class=>'form horizontal'，：name=>'myForm'}do | f |%>
{:name=>amount'}，as:：string%>
{:name=>'status'}，集合：Invoice:：VALID\u status%>

提交表单时，在表单实际发布到服务器之前，将触发一个简短的演练
onSubmit

由事件触发并以
return（false）终止的javascrtipt函数
将立即终止事件，而
返回（true）（或者几乎所有其他的东西）使活动按计划继续进行

最后，请注意，完全依赖客户端验证是一个糟糕的想法，因为有决心的用户可能会执行以下操作：

1） 在firebug打开的情况下进行完全合法的提交，并检查标题等。

2） 创建自己的HTTP请求，其中包含虚假/错误数据。

3） 通过各种HTTP工具中的任何一种提交它

客户端验证是一个“好东西”。
服务器端验证是“必须具备的”。
如果要在客户端进行验证：

<script>
   $(document).ready(function(){
      $('#status').change(function(){
          if($(this).val() == "Closed" && ($('#amount').val() == null || $('#amount') == "")){
            alert("Amount must be needed when status is closed")
          }
        });
     });
</script>


$（文档）.ready（函数（）{
$（'#status'）。更改（函数（）{
如果（$（this）.val（）=“已结”&（$（“#金额”）.val（）==空（$（“#金额”）==”）{
警报（“状态为关闭时必须需要金额”）
}
});
});
如果要在客户端执行此操作：

<script>
   $(document).ready(function(){
      $('#status').change(function(){
          if($(this).val() == "Closed" && ($('#amount').val() == null || $('#amount') == "")){
            alert("Amount must be needed when status is closed")
          }
        });
     });
</script>


$（文档）.ready（函数（）{
$（'#status'）。更改（函数（）{
如果（$（this）.val（）=“已结”&（$（“#金额”）.val（）==空（$（“#金额”）==”）{
警报（“状态为关闭时必须需要金额”）
}
});
});
您希望在表单发布后在服务器端执行此操作，还是在表单发布前在客户端执行此操作？（真的，正确的答案是两者都有，但你的问题是什么？）？您是否控制您使用的javascript库/插件？您希望在发布表单之后在服务器端执行此操作，还是在发布表单之前在客户端执行此操作？（真的，正确的答案是两者都有，但你的问题是什么？）？您是否控制了您使用的javascript库/插件？+Abraham P，感谢您的回复。这太棒了。那么，在服务器端，我将如何处理这些问题呢above@zurikMichael Durrant给出的解决方案是服务器端验证感谢@checkit，这真的很有帮助，添加了关于gem的信息，可以使用模型级验证进行客户端验证。+Abraham P，感谢您的回复。这太棒了。那么，在服务器端，我将如何处理这些问题呢above@zurikMichael Durrant给出的解决方案是服务器端验证感谢@checkit，这真的很有帮助，添加了关于gem的信息，该信息将使用模型级验证进行客户端验证。我尝试使用您的方法并得到错误“uninitialized constant Invoice:：False”我把金额不是零改成了！amount.nil？事实上，我认为您可以使用amount（更新答案），因为这是活动记录，并且该属性将存在。我尝试使用您的方法并得到错误“uninitialized constant Invoice:：False”，我将amount not nil更改为！amount.nil？实际上我认为您可以使用amount（更新了答案），因为这是活动记录，并且该属性将存在。