Rails:是twitter typeahead冲突客户端验证?

时间:2015-07-28 12:15:26

标签: jquery ruby-on-rails-3 validation client-side-validation twitter-typeahead

我在我的rails(v3.0.20)应用中使用client side validation(v3.0.13)gem。最近我为自动建议添加了twitter's typeahead.js(v0.10.2)。

我有一个名为保险的模型和列'名称'是强制性的。当我提交一个加载了这两个js文件的表单时,我收到javascript错误无法读取属性'存在'浏览器控制台中未定义的在此错误之后,其他javascript代码无法运行,例如,如果我在表单提交功能中放置警报,则其无法正常工作。

模型

insurance.rb

    class Insurance < ActiveRecord::Base
        validates :name, :presence =>  { :message => "Must be filled" }
    end

form.html.erb

    <%= javascript_include_tag "rails.validations", "typeahead" %>
    <%= stylesheet_link_tag "typeahead"%>

    <%= form_for @insurance, :validate => true, :html => {:id => 'insurance_form', :class=>"form-horizontal"} do |f| %>
    <div class="control-group">
        <%= f.label :name, :class=>"control-label" %>
        <div class="controls">
            <%= f.text_field :name, :class =>"input-medium typeahead" %>
        </div>
    </div>
    ...
    <% end %>

我的javascript代码

    var insurance_names = ["aaa", "bbb", "ccc"];

    var substringMatcher = function(strs) {
      return function findMatches(q, cb) {
        var matches, substringRegex;
        matches = [];
        substrRegex = new RegExp(q, 'i');
        $.each(strs, function(i, str) {
          if (substrRegex.test(str)) {
            matches.push({ value: str });
          }
        });     
        cb(matches);
      };
    };

    $('.typeahead').typeahead({
      hint: true,
      highlight: true,
      minLength: 1
    },
    {
      name: 'insurance_names',
      displayKey: 'value',
      source: substringMatcher(insurance_names)
    }).on('typeahead:selected', function($e, datum){
        $(this).trigger('change');
    });

如果我评论模型验证码然后提交表单,那么就没有javascript错误。 而且没有这个typeahead.js客户端验证工作正常。

这是我提交表单时触发的POST请求:

Started POST "/insurances" for 127.0.0.1 at 2015-07-28 18:31:53 +0530 Processing by InsurancesController#create as HTML Parameters: {"utf8"=>"✓", "insurance"=>{"insurance_name"=>"", "description"=>""}, "commit"=>"Create insurance"}....Rendered insurances/new.html.erb within layouts/nhs-full (209.4ms) Completed 200 OK in 8333ms (Views: 218.3ms | ActiveRecord: 84.5ms) 

任何人都可以帮我解决这个问题吗?

1 个答案:

答案 0 :(得分:0)

问题与验证无关。如果您查看您的服务器日志,您会注意到名称和描述都是作为空字符串传递的。

猜测你的问题来自以下几点:

}).on('typeahead:selected', function($e, datum){
    $(this).trigger('change');
});

如果预先输入实际正在工作(键入时显示部分匹配),则问题是您最终选择的字符串不会被添加到名称/描述输入的值中。我猜测如果你输入一个没有匹配的随机字符串就可以正常工作,或者至少它会传递名字和d或描述参数。

可能不是您要找的答案,但至少您知道您的问题与ActiveRecord验证无关。