Question

我正在使用gem＆＃39; client_side_validations＆＃39; 和gem＆＃39; client_side_validations-simple_form＆＃39;并且所有验证工作都是正常形式，但在尝试适应自举模式时不起作用，这是我在模态中的形式：

<div class="modal-content" id="modal_usuario">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>

</div>
 <div class="modal-body">
 <%= simple_form_for(@usuario, html: {class: "miform form-horizontal"}, validate: true) do |f| %>
 <h4>Nuevo Usuario</h4>
 <%= f.error_notification %>

  <div class="form-group">
    <%= f.label :usuario, class: "col-sm-4" %>
    <%= f.text_field :usuario, class: "col-sm-5" %>
  </div>

  <div class="form-group">
  <%= f.label :password, class: "col-sm-4" %>
  <%= f.password_field :password, class: "col-sm-5" %>
</div>
<div class="form-group">
   <%= f.label :password_confirmation, "Confirmar contraseña", class: "col-sm-4" %>
    <%= f.password_field :password_confirmation, class: "col-sm-5" %>
</div>
--- some extra code---

这是我的new.js.erb

$("#modal-window").html("<%= j (render partial: 'new' ) %>");

所以模态显示正确但客户端验证不起作用，我阅读了这个gem的文档并显示了这个解决方案： https://github.com/DavyJonesLocker/client_side_validations/wiki/Bootstrap-Modal-Validations

$(document).on 'shown.bs.modal', '.modal', ->
  $('form[data-client-side-validations]').enableClientSideValidations()

但我不知道在哪里添加此代码，我想在js中添加它而不是在coffe中。有人可以告诉我如何将此代码转换为js以及我应该在哪个文件夹或文件中添加此代码？或者如果你有其他解决方案。感谢

我正在使用：gem＆＃39; rails＆＃39;，＆＃39;〜＆gt; 5.0.3＆＃39;，

gem＆＃39; bootstrap-sass＆＃39;，＆＃39; 3.3.7＆＃39;

Answer 1

在您app/assets/javascript/application.js require_tree .内，这意味着如果您创建一个名为boostrap_client_side_val.js的新文件，您只需粘贴此文件即可。

$(document).on('shown.bs.modal', function() {
  $('form[data-client-side-validations]').enableClientSideValidations();
}).modal('show');

Answer 2

我知道这很老了，但也许这可以为某人省些心痛。默认情况下，此gem仅启用/验证VISIBLE表单，因此模态和制表符很麻烦，因为它们只有在显示show.bs.modal和show.bs.tab事件后（通常在运行JS之后）才可见。经过几次摆弄绑定的迭代之后，我发现这是最简单的解决方案……只需覆盖gem的选择器，以便它将启用并验证隐藏的表单。

// my-client-side-validations-initializer.js

window.ClientSideValidations.selectors = {
    inputs: ':input:not(button):not([type="submit"])[name]:enabled',
    validate_inputs: ':input:enabled[data-validate]',
    forms: 'form[data-client-side-validations]'
}

Rails 5 client_side_validation无法处理模态

2 个答案: