Parsley.js 1.x-动态更改表单数据属性时出错 [英] Parsley.js 1.x - Error when form data attributes are changed on the fly

问题描述

在第一个键入事件中输入#myTestField时，我的Parsley错误消息是

My Parsley error message on the first keyup event when typing into field #myTestFieldis

此值太短.它应该包含 4个字符或更多.

我试图即时更改Parsley字段数据属性，但这似乎不起作用.它将分配的值保留在第一位(html格式)，而无需考虑JS代码中修改后的值.

I tryed to change Parsley field data attributes on the fly, but it seems this doesn't work. It keeps the value assigned in first place (html form) without taking in account the modified one in the JS code.

在Chrome上，我可以检查DOM加载后数据属性值是否已更改.

On Chrome I can check that the data attribute value is changed after the DOM is loaded.

我的代码是

<form name="myForm" id="myForm">
    <input type="text" name="myTestField" id="myTestField" data-trigger="keyup" data-minlength="4" data-validation-minlength="0" >
    <button id="mySubmitButton" type="submit" >Save</button>
</form>

<script>
// wait for the DOM to be loaded 
    $(document).ready(function() {
    // destroy
    $('#myForm').parsley('destroy');
    // change attribute
    $('#myTestField').attr('data-minlength','2');
    // assign parsley to do the job
    $('#myForm').parsley();
      });
</script>

我做错了什么?

更新:

这是Parsley.js的一个已知问题，在GitHub上有一个问题#52

This is a known issue of Parsley.js and theres a Issue #52 on GitHub

我还尝试在同一输入#Id上使用removeItem()，然后使用addItem()，但也没有用.

I also tried to use removeItem() followed by addItem() on the same input #Id but didn't work either.

我仍在尝试解决方法

推荐答案

欧芹基于数据属性，这些属性由jQuery与.data()

Parsley is based on data attributes, that are binded by jQuery with .data()

不幸的是，当您添加数据属性时，它没有绑定到jQuery .data().您必须通过这种方式动态添加验证器:

Unfortunately, when you add a data- attr, it is not binded to jQuery .data(). You'll have to add the validators this way on the fly:

<script>
// wait for the DOM to be loaded 
    $(document).ready(function() {
      // destroy
      $('#myForm').parsley('destroy');
      // change attribute
      $('#myTestField').data('minlength', 2);
      // assign parsley to do the job
      $('#myForm').parsley();
    });
</script>

我将添加一个API，以快速添加/编辑/删除验证器，而无需调用destroy:)

I'll add an API to add / edit / remove validators on the fly, without having to call destroy :)

这篇关于Parsley.js 1.x-动态更改表单数据属性时出错的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！