У меня есть форма, в которой мне нужно проверить, что по крайней мере в 5 полях выбора установлено значение «Да» (или . Если их больше, это нормально, но если их меньше, мне нужно, чтобы он не отправлял форму и не отображал ошибку. Таким образом, Мне нужен собственный валидатор.
Я создал jsfiddle, чтобы показать полный пример https://jsfiddle.net/kittonian/v9w8rgeb/
Кроме того, вот пример кода:
<html>
<head></head>
<body>
<form name="select_test" id="postfeatured" method="post" action="#">
<div class="choice">
<div>
<select name="post_featured1" id="post_featured1" class="select enabled" data-parsley-group="minselect" data-parsley-enabled="1">
<option value="t">Y</option>
<option value="f">N</option>
</select>
</div>
<div>
<select name="post_featured2" id="post_featured2" class="select enabled" data-parsley-group="minselect" data-parsley-enabled="2">
<option value="t">Y</option>
<option value="f">N</option>
</select>
</div>
<div>
<select name="post_featured3" id="post_featured3" class="select enabled" data-parsley-group="minselect" data-parsley-enabled="3">
<option value="t">Y</option>
<option value="f">N</option>
</select>
</div>
<div>
<select name="post_featured4" id="post_featured4" class="select enabled" data-parsley-group="minselect" data-parsley-enabled="4">
<option value="t">Y</option>
<option value="f">N</option>
</select>
</div>
<div>
<select name="post_featured5" id="post_featured5" class="select enabled" data-parsley-group="minselect" data-parsley-enabled="5">
<option value="t">Y</option>
<option value="f">N</option>
</select>
</div>
<div>
<select name="post_featured6" id="post_featured6" class="select enabled" data-parsley-group="minselect" data-parsley-enabled="6">
<option value="t">Y</option>
<option value="f">N</option>
</select>
</div>
</div>
<div class="submit">
<input type="submit" value="SUBMIT" class="submitbutton">
</div>
</form>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js" integrity="sha512-bLT0Qm9VnAYZDflyKcBaQ2gg0hSYNQrJ8RilYldYQ1FxQYoCLtUjuuRuZo+fjqhx/qtq/1itJ0C2ejDxltZVFg==" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js" integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/parsley.js/2.9.2/parsley.min.js" integrity="sha512-eyHL1atYNycXNXZMDndxrDhNAegH2BDWt1TmkXJPoGf1WLlNYt08CSjkqF5lnCRmdm3IrkHid8s2jOUY4NIZVQ==" crossorigin="anonymous"></script>
</body>
</html>А вот текущий JS, вызывающий Parsley. Он проверяет только дубликаты и не проверяет, установлено ли в 5 полях выбора значение «Да». Мне также нужно, чтобы сообщение об ошибке отображалось только в полях выбора, для которых установлено значение «Нет».
var validating;
$("#postfeatured").parsley();
$('select.enabled').change(()=>{
if(!validating) return; $("#postfeatured").parsley().validate({group:'minselect'});
});
window.Parsley.addValidator("enabled", {
validateMultiple: function(values) {
return values.length > 0;
},
requirementType: "string",
validateString: function(value, current) {
validating=true;
var els=$('select[id^="post_featured"]');
ar=[];
for(let i=0;i<els.length;i++) ar.push(jQuery(els[i]).val());
// first simply find if there are any dupes
// https://stackoverflow.com/a/7376645
// https://www.geeksforgeeks.org/how-to-convert-set-to-array-in-javascript/
var sar=Array.from(new Set(ar));
if(sar.length !== ar.length){
// there are dupes
// returning false here makes ALL fields show an error, so we have to find out which ones are dupes and check if current is one of them
// for each filtered (Set array) value, check if more than one and if so return false if equal to current field value
for(let i=0;i<sar.length;i++){
var cnt=0;
for(let j=0;j<ar.length;j++){
if(ar[j]===sar[i]) cnt++;
}
if(cnt>1 && $('#post_featured'+current).val()==sar[i]) return false;
}
}
return true;
},
priority: 33,
messages: {en: 'You must have at least 5 featured posts'}
});