Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE html>
<html>
<head>
  <link href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css" rel="stylesheet">
  <link href="http://twitter.github.com/bootstrap/assets/css/bootstrap-responsive.css" rel="stylesheet">
  <!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
    <!--[if lt IE 9]>
      <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
  <script src="http://twitter.github.com/bootstrap/assets/js/bootstrap-button.js"></script>
  <script class="jsbin" src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
  <script class="jsbin" src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.9/jquery.validate.min.js"></script>
<meta charset=utf-8 />
<title>Bootstrap + JQuery Validate</title>
<style>
  article, aside, figure, footer, header, hgroup, 
  menu, nav, section { display: block; }
  .control-group.error .help-block { color: blue; }
  .control-group .help-block { color: blue; }
</style>
</head>
<body>
  <br>
  <form id="test-form" class="form-horizontal">
    <fieldset>
      <div class="control-group">
        <label class="control-label" for="place-of-birth">Place of birth</label>
        <div class="controls">
          <p class="help-block">Please input place of birth below, 2-80 symbols</p>
          <input type="text" class="input-xlarge" id="place-of-birth" name="place-of-birth" minlength="2" maxlength="80" autocomplete="off" value="V">
        </div>
      </div>
      <div class="control-group">
        <label class="control-label" for="amount">Amount</label>
      <div class="controls">
        <div class="input-append">
          <input type="text" class="input-small" id="amount" name="amount" maxlength="7"><span class="add-on">USD</span>
        </div>
        <p class="help-block">input non-digit value and click somewhere to see the problem</p>        
      </div>                 
    </div>
      <input type="button" id="validate" name="validate" value="Validate">
      <input type="submit" id="validate" name="validate" value="Submit">
    </fieldset>
  </form>
</body>
</html>
Output 300px

This bin was created anonymously and its free preview time has expired (learn why). — Get a free unrestricted account

Dismiss x
public
Bin info
anonymouspro
0viewers