0

친구 다운로드 옵션이 페이지의 끝에서 http://formvalidation.io/examples/changing-success-error-colors/

에서 참조를 복용하여 부트 스트랩 검증을 수행하기 시작하고 프레임 워크. 다운로드를 클릭하면 기초, 순수, 의미 및 UI 키트와 같은 것을 사용합니다.

나는 그들이 한 일을 정확히하고 싶습니다. 아무도 그 일을 설명 할 수 있습니까? 여기

내 바이올린 https://jsfiddle.net/0s9xw5rx/2/

CSS는 다음과 같습니다

.field-error .control-label, 
.field-error .help-block, 
.field-error .form-control-feedback { 
    color: #ff0039; 
} 

.field-success .control-label, 
.field-success .help-block, 
.field-success .form-control-feedback { 
    color: #2780e3; 
} 

HTML

<form id="loginForm" method="post" class="form-horizontal"> 
    <div class="form-group"> 
     <label class="col-xs-3 control-label">Username</label> 
     <div class="col-xs-5"> 
      <input type="text" class="form-control" name="username" /> 
     </div> 
    </div> 

    <div class="form-group"> 
     <label class="col-xs-3 control-label">Password</label> 
     <div class="col-xs-5"> 
      <input type="password" class="form-control" name="password" /> 
     </div> 
    </div> 

    <div class="form-group"> 
     <div class="col-xs-9 col-xs-offset-3"> 
      <button type="submit" class="btn btn-primary">Sign in</button> 
     </div> 
    </div> 
</form> 

스크립트

$(document).ready(function() { 
    $('#loginForm').formValidation({ 
     framework: 'bootstrap', 
     icon: { 
      valid: 'glyphicon glyphicon-ok', 
      invalid: 'glyphicon glyphicon-remove', 
      validating: 'glyphicon glyphicon-refresh' 
     }, 
     row: { 
      valid: 'field-success', 
      invalid: 'field-error' 
     }, 
     fields: { 
      username: { 
       validators: { 
        notEmpty: { 
         message: 'The username is required' 
        }, 
        stringLength: { 
         min: 6, 
         max: 30, 
         message: 'The username must be more than 6 and less than 30 characters long' 
        }, 
        regexp: { 
         regexp: /^[a-zA-Z0-9_\.]+$/, 
         message: 'The username can only consist of alphabetical, number, dot and underscore' 
        } 
       } 
      }, 
      password: { 
       validators: { 
        notEmpty: { 
         message: 'The password is required' 
        } 
       } 
      } 
     } 
    }); 
}); 
+0

안녕하세요, 오랫동안 당신의 답변이 없습니다. 도와 드릴까요? – elicohenator

답변

1

귀하의 질문이 너무 명확하고 명확하지 않습니다. Formvalidtion.io는 프레임 워크 사용자의 양식을 확인하는 라이브러리입니다. 그것은 내가 Bootstrap/Foundation을 사용한다면 ... 프레임 워크의 Forms 디자인과 동작을 이 라이브러리와 함께 사용할 수 있음을 의미합니다.

우리가 당신을 도울 수 있도록 다음과 같은 질문에 답하십시오

  • 당신은 당신의 사이트의 프레임 워크를 사용합니까? 그렇다면 어느 것입니까?
  • 양식을 구현하셨습니까?
  • 문서에 설명 된대로 사이트에 라이브러리를 연결 했습니까?