Notice
Recent Posts
Recent Comments
«   2024/11   »
1 2
3 4 5 6 7 8 9
10 11 12 13 14 15 16
17 18 19 20 21 22 23
24 25 26 27 28 29 30
Archives
Today
In Total
관리 메뉴

A Joyful AI Research Journey🌳😊

Bootstrap: Form의 validation이 안 될 때 needs-validation, novalidate 추가하기 본문

💻Bootcamp Self-Study Revision✨/HTML5, CSS, Bootstrap, JSP

Bootstrap: Form의 validation이 안 될 때 needs-validation, novalidate 추가하기

yjyuwisely 2023. 5. 4. 11:45

230504 Thu

부트스트랩의 validation 기능을 쓰고 있는 데
<form>태그 안에 id = "needs-validation"과 novalidate를 추가하면 부트스트랩 자체의 validation이 정상적으로 작동한다.

<form id="needs-validation" action="memberJoin" method="post" novalidate>
    <div class="Sans form-floating text-muted mb-3">
        <input class="form-control" name="password" id="password"
            placeholder="비밀번호" type="password" required
            pattern="^(?=.*[a-zA-Z])(?=.*[!@#$%^*+=-])(?=.*[0-9]).{8,25}" />
        <label for="password">비밀번호 (영문 숫자 특수문자 조합, 8자리 이상)</label>
        <div class="valid-feedback">좋아요!</div>
        <div class="invalid-feedback">영문자, 숫자, 특수기호 조합으로 8자 이상으로
            입력하세요.</div>
    </div>
</form>


id = "needs-validation": enable the validation and feedback messages.

novalidate: disable the browser's built-in validation.


728x90
반응형
Comments