如何重构重复的jquery验证方法?

时间:2016-02-01 14:24:32

标签: javascript jquery ruby-on-rails jquery-validate

在我的rails应用程序中,我在js.erb文件中有这个jquery验证代码,该文件在页面加载时加载。

  if ($('#custom-tag').length) {
    $('#custom-tag').validate({
      onfocusout: false,
      rules: {
        tag: {
          minLengthSquish: 2,
          maxLengthSquish: 25
        }
      },
      tooltip_options: {
        tag: { placement: 'right', animation: false }
      }
    });
  }

页面加载时表单存在,但用户可以通过ajax请求添加和删除标记。对于每个请求,表单都会重新呈现,因为只有在标记计数为5或更少时才会显示表单,因此每次表单加载时我都需要重新初始化jquery验证。这个完全相同的代码存在于我的add_tag.js.erb和remove_tag.js.erb文件中,这些文件是通过ajax从控制器调用的。

我只是想知道在三个地方使用这个重复代码是否是实现此目的的唯一方法。

1 个答案:

答案 0 :(得分:1)

  

页面加载时表单存在,但用户可以通过ajax请求添加和删除标记。对于每个请求,表单都会重新呈现,因为表单只会在标记计数为5或更少时显示,所以每次表单加载时我都需要重新初始化jquery validate

无法 "重新初始化" jQuery在同一表单上验证。始终忽略对.validate()的后续调用。

每当您更改表单时,您都可以use the .rules() method动态addremove规则。

// on page load
$('#custom-tag').validate({ // initialize plugin on the form; can only be done once
    // options, etc.
    onfocusout: false,
    rules: {   // initial rules
        tag: {
            minLengthSquish: 2,
            maxLengthSquish: 25
        }
    }
});

// make changes dynamically
$('.newfields').each(function() { // add rules to multiple fields
    $(this).rules('add', {
        minLengthSquish: 5,
        maxLengthSquish: 50
    });
});

$('[name="tag"]').rules('add', {  // add rules to one field
    minLengthSquish: 30,
    maxLengthSquish: 55
});

$('[name="tag"]').rules('remove');  // remove all rules from one field