> 백엔드 개발 > PHP 튜토리얼 > javascript - 부트스트랩 양식 유효성 검사에 대한 질문

javascript - 부트스트랩 양식 유효성 검사에 대한 질문

WBOY
풀어 주다: 2016-08-04 09:20:48
원래의
1469명이 탐색했습니다.

백그라운드에 설정된 부트스트랩은 스타일 측면에서 대부분의 스타일을 만족시킬 수 있지만 기성 부트스트랩 템플릿을 사용하는 양식 제출에 문제가 있습니다. 코드는 다음과 같습니다

<code>  <form class="form-signin">
    <h2 class="form-signin-heading">Please sign in</h2>
    <label for="inputEmail" class="sr-only">Email address</label>
    <input type="email" id="inputEmail" class="form-control" placeholder="Email address" required autofocus>
    <label for="inputPassword" class="sr-only">Password</label>
    <input type="password" id="inputPassword" class="form-control" placeholder="Password" required>
    <div class="checkbox">
      <label>
        <input type="checkbox" value="remember-me"> Remember me
      </label>
    </div>
    <button class="btn btn-lg btn-primary btn-block" type="submit">Sign in</button>
  </form>

</div> <!-- /container -->

</code>
로그인 후 복사
로그인 후 복사

양식 검증 방법에 관해서는 공식 홈페이지에 소개가 없습니다. require가 무슨 뜻인지는 알지만 이 부분에 대한 소개는 어디서 볼 수 있는지 알고 싶은데 공식 홈페이지에서는 찾을 수 없습니다. . 모두 감사합니다

비동기적으로 제출하기 위해 ajax를 작성했는데 작동하지 않았기 때문입니다. 비동기 제출을 위해 bs와 함께 제공되는 확인 양식을 사용하고 싶습니다. 감사합니다

답글 내용:

백그라운드에 설정된 부트스트랩은 스타일 측면에서 대부분의 스타일을 만족시킬 수 있지만 기성 부트스트랩 템플릿을 사용하는 양식 제출에 문제가 있습니다. 코드는 다음과 같습니다

<code>  <form class="form-signin">
    <h2 class="form-signin-heading">Please sign in</h2>
    <label for="inputEmail" class="sr-only">Email address</label>
    <input type="email" id="inputEmail" class="form-control" placeholder="Email address" required autofocus>
    <label for="inputPassword" class="sr-only">Password</label>
    <input type="password" id="inputPassword" class="form-control" placeholder="Password" required>
    <div class="checkbox">
      <label>
        <input type="checkbox" value="remember-me"> Remember me
      </label>
    </div>
    <button class="btn btn-lg btn-primary btn-block" type="submit">Sign in</button>
  </form>

</div> <!-- /container -->

</code>
로그인 후 복사
로그인 후 복사

양식 검증 방법에 관해서는 공식 홈페이지에 소개가 없습니다. require가 무슨 뜻인지는 알겠는데 이 부분에 대한 소개는 어디서 볼 수 있는지 알고 싶은데 공식 홈페이지에는 없네요. . 모두 감사합니다

비동기적으로 제출하기 위해 ajax를 작성했는데 작동하지 않았기 때문입니다. 비동기 제출을 위해 bs와 함께 제공되는 확인 양식을 사용하고 싶습니다. 감사합니다

간단합니다.

<code>$("form").submit(function(e){
    e.preventDefault();   // disabled default action
    // do something and ajax ....
    $.post("url", $("form").serializeArray())
    .done(function(){})
    .failed(function(){})
    
  });</code>
로그인 후 복사

처리를 위해 양식 데이터를 ajax에 제출하기 전에 데이터를 확인하는 함수를 작성합니다. 성공하면 ajax로 전달되고, 실패하면 프롬프트 메시지가 반환됩니다.

폼 태그에 액션의 서버 주소를 적어주세요.

github에서 검색했는데 많이 있습니다. https://github.com/search?utf8=✓&q=Bootstrap Validator를 선택하세요

jQuery Validate Tutorial http://www.runoob.com/jquery/jquery-plugin-validate.html 페이지를 볼 수 있습니다

이를 수행하는 데 도움이 되는 플러그인이 있습니다

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿