jquery 유효성 검사 다중 선택 상자

Question

여러 개의 선택 목록 상자가있는 양식이 있습니다. 여기에서 사용하십시오 (https://silviomoreto.github.io/bootstrap-select/examples/#custom-button-text) 나는 그것을 확인하고 싶습니다. 모든 것이 좋고, 양식을 제출할 때이 필드가 더 복잡하지만 테두리 색이 붉은 색으로 변하지 않는다는 메시지를 돌려줍니다.

Answer 1

저는 js 바이올린을 만들고 문제를 볼 수 없습니다. 당신은이 링크 https://jsfiddle.net/36zopv3v/2/

을 확인할 수 있습니다

<form data-toggle="validator" role="form"> 
    <div class="form-group"> 
    <label class="control-label">Select</label> 
    <select required multiple class="form-control selectpicker"> 
     <option value="1">item1</option> 
     <option value="2">item2</option> 
    </select> 
    </div> 
    <div class="form-group"> 
    <label for="inputName" class="control-label">Name</label> 
    <input type="text" class="form-control" id="inputName" placeholder="Cina Saffary" required> 
    </div> 
    <div class="form-group has-feedback"> 
    <label for="inputTwitter" class="control-label">Twitter</label> 
    <div class="input-group"> 
     <span class="input-group-addon">@</span> 
     <input type="text" pattern="^[_A-z0-9]{1,}$" maxlength="15" class="form-control" id="inputTwitter" placeholder="1000hz" required> 
    </div> 
    <span class="glyphicon form-control-feedback" aria-hidden="true"></span> 
    <div class="help-block with-errors">Hey look, this one has feedback icons!</div> 
    </div> 
    <div class="form-group"> 
    <label for="inputEmail" class="control-label">Email</label> 
    <input type="email" class="form-control" id="inputEmail" placeholder="Email" data-error="Bruh, that email address is invalid" required> 
    <div class="help-block with-errors"></div> 
    </div> 
    <div class="form-group"> 
    <label for="inputPassword" class="control-label">Password</label> 
    <div class="form-inline row"> 
     <div class="form-group col-sm-6"> 
     <input type="password" data-minlength="6" class="form-control" id="inputPassword" placeholder="Password" required> 
     <div class="help-block">Minimum of 6 characters</div> 
     </div> 
     <div class="form-group col-sm-6"> 
     <input type="password" class="form-control" id="inputPasswordConfirm" data-match="#inputPassword" data-match-error="Whoops, these don't match" placeholder="Confirm" required> 
     <div class="help-block with-errors"></div> 
     </div> 
    </div> 
    </div> 
    <div class="form-group"> 
    <div class="radio"> 
     <label> 
     <input type="radio" name="underwear" required> Boxers 
     </label> 
    </div> 
    <div class="radio"> 
     <label> 
     <input type="radio" name="underwear" required> Briefs 
     </label> 
    </div> 
    </div> 
    <div class="form-group"> 
    <div class="checkbox"> 
     <label> 
     <input type="checkbox" id="terms" data-error="Before you wreck yourself" required> Check yourself 
     </label> 
     <div class="help-block with-errors"></div> 
    </div> 
    </div> 
    <div class="form-group"> 
    <button type="submit" class="btn btn-primary">Submit</button> 
    </div> 
</form> 

Answer 2

<select required multiple> 
    <option value="1">item1</option> 
    <option value="2">item2</option> 
</select> 
<style> 
.has-error .btn-default{border:2px solid red !important} 
</style>