Parsley JS 不等于多个 ID

Posted

技术标签:

【中文标题】Parsley JS 不等于多个 ID【英文标题】:Parsley JS Not Equal To Multiple IDs 【发布时间】:2020-09-09 18:11:31 【问题描述】:

我有一个包含多个选择框的表单,需要确保没有在其中任何一个中设置相同的值。例如,如果选择框 1 设置为 2,并且选择框 4 也设置为 2,我应该会收到错误消息。我可以使用单个 ID 进行此操作,但无法使用逗号分隔的多个 ID。

另一个要求是,一旦用户纠正了错误并且无需再次提交表单,我需要 Parsley 验证 .change。

仅适用于单个 ID 的代码是:

window.Parsley.addValidator("notequalto", 
    requirementType: "string",
    validateString: function(value, element) 
        return value !== $(element).val();
    
);

我目前拥有的验证码是:

var validating;

$("#postorg").parsley();

$('#series_post_order1').change(()=>
 if(!validating) return; $("#postorg").parsley().validate(group:'postorder');
);
$('#series_post_order2').change(()=>
 if(!validating) return; $("#postorg").parsley().validate(group:'postorder');
);
$('#series_post_order3').change(()=>
 if(!validating) return; $("#postorg").parsley().validate(group:'postorder');
);
$('#series_post_order4').change(()=>
 if(!validating) return; $("#postorg").parsley().validate(group:'postorder');
);

window.Parsley.addValidator("notequalto", 
      validateMultiple: function(values) 
        return values.length > 0;
      ,
    requirementType: "string",
    validateString: function(value, element) 
     var els=element.split(',');
     for(let i=0;i<els.length;i++)
       if (jQuery(els[i]).val())
        return value !== $(element).val();
       
     
      return true;
   ,
   priority: 33
);

表格如下所示:

<form name="series_edit_postorg" id="postorg" method="post" action="series_postorg">

<div class="formbig-mobile">

<select name="series_post_order1" class="select" id="series_post_order1" data-parsley-group="postorder" data-parsley-notequalto="#series_post_order2,#series_post_order3,#series_post_order4" data-parsley-notequalto-message="Each post must have a different number">
<option value="1" selected>1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
</select>

<select name="series_post_order2" class="select" id="series_post_order2" data-parsley-group="postorder" data-parsley-notequalto="#series_post_order1,#series_post_order3,#series_post_order4" data-parsley-notequalto-message="Each post must have a different number">
<option value="2" selected>2</option>
<option value="1">1</option>
<option value="3">3</option>
<option value="4">4</option>
</select>
</div>

<select name="series_post_order3" class="select" id="series_post_order3" data-parsley-group="postorder" data-parsley-notequalto="#series_post_order1,#series_post_order2,#series_post_order4" data-parsley-notequalto-message="Each post must have a different number">
<option value="3" selected>3</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="4">4</option>
</select>
</div>

<select name="series_post_order4" class="select" id="series_post_order4" data-parsley-group="postorder" data-parsley-notequalto="#series_post_order1,#series_post_order2,#series_post_order3" data-parsley-notequalto-message="Each post must have a different number">
<option value="4" selected>4</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
</div>

<input type="submit" name="submit" value="UPDATE" class="selectbutton">

</form>

【问题讨论】:

【参考方案1】:

这是解决这个问题的答案:

var validating;

$("#postorg").parsley();

$('.select').change(()=>
if(!validating) return; $("#postorg").parsley().validate(group:'postorder');
);

window.Parsley.addValidator("notequalto", 
      validateMultiple: function(values) 
        return values.length > 0;
      ,
    requirementType: "string",
    validateString: function(value, requirement) 
      validating = true;
      var $otherElements = $(requirement);
      var duplicateFound = false;
      
      $otherElements.each(function()
        duplicateFound = duplicateFound || this.value === value;
      );
      
      return !duplicateFound;
   ,
   priority: 33
);

【讨论】:

以上是关于Parsley JS 不等于多个 ID的主要内容,如果未能解决你的问题,请参考以下文章

Parsley JS 强制字段验证状态失败

Parsley.js 中的自定义正则表达式验证器

parsley.js 验证但不提交

Parsley JS 未验证

oracle中怎么查询一列必须等于多个值

Parsley.js 从 Safari/Firefox 中的电子邮件中去除加号 (+)?