时间戳

首页 > 解决方案 > 如何将 JQuery Validation 与 JQuery 多选插件一起使用

javascript - 如何将 JQuery Validation 与 JQuery 多选插件一起使用

问题描述

我正在尝试在多选字段上设置一些验证规则。问题是验证仅在我停用 JQuery 多选插件时才有效。见小提琴。有没有办法让两者一起工作？

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<!doctype html>
<html>
<head>

<link 	href="http://wowislandcharter.com/roit/script/jquery/multiselect/multiselect.css"
    type="text/css"
    rel="stylesheet"/>

<script src="https://code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="https://cdn.jsdelivr.net/jquery.validation/1.16.0/jquery.validate.min.js"></script>
<script src="https://cdn.jsdelivr.net/jquery.validation/1.16.0/additional-methods.min.js"></script>


</head>
<body>
<form id="myform">

<select id="symptom" name="symptom" multiple="" size="15" >

    <option value="1">Watery diarrhea</option><option value="2">Abdominal cramps</option><option value="3">Nausea</option><option value="4">Vomiting</option><option value="5">Diarrhea</option><option value="6">Fever</option><option value="7">Bloody Diarrhea</option><option value="8">Cramps</option><option value="9">Facial pallor</option><option value="10">Tea-colored urine</option><option value="11">Abdominal pain</option><option value="12">Jaundice</option><option value="13">Headache</option><option value="14">Stiff neck</option><option value="15">Weakness</option><option value="16">Confusion</option>

</select>

<br/>
<input type="submit" value="Validate!">
</form>

<script src="http://wowislandcharter.com/roit/script/jquery/multiselect/multiselect.js"></script>

<script>
$("#symptom").multiselect({

    columns:2,
    texts:{placeholder:"SELECT SYMPTOM"}

   })



$( "#myform" ).validate({
  rules: {
    symptom: {
      required: true,

    }

  }
});
</script>
</body>
</html>

标签： javascriptjqueryjquery-validatejquery-ui-multiselect

解决方案

推荐阅读