//tile
<section class="tile">

  //tile header
  <div class="tile-header">
    <h1><strong>Basic</strong> Validations</h1>
    <div class="controls">
      <a href="#" class="refresh"><i class="fa fa-refresh"></i></a>
      <a href="#" class="remove"><i class="fa fa-times"></i></a>
    </div>
  </div>
  // /tile header

  //tile body
  <div class="tile-body">
                    
    <form class="form-horizontal" role="form" parsley-validate id="basicvalidations">
      
      <div class="form-group">
        <label for="fullname" class="col-sm-4 control-label">Full Name *</label>
        <div class="col-sm-8">
          <input type="text" class="form-control" id="fullname" parsley-trigger="change" parsley-required="true" parsley-minlength="4" parsley-validation-minlength="1">
        </div>
      </div>

      <div class="form-group">
        <label for="email" class="col-sm-4 control-label">Email *</label>
        <div class="col-sm-8">
          <input type="email" class="form-control" id="email" parsley-trigger="change" parsley-required="true" parsley-minlength="4" parsley-type="email" parsley-validation-minlength="1">
        </div>
      </div>

      <div class="form-group">
        <label for="password" class="col-sm-4 control-label">Password *</label>
        <div class="col-sm-8">
          <input type="password" class="form-control" id="password" parsley-trigger="change" parsley-required="true" parsley-minlength="6" parsley-type="alphanum" parsley-validation-minlength="1">
        </div>
      </div>

      <div class="form-group">
        <label for="passwordconfirm" class="col-sm-4 control-label">Password Confirm *</label>
        <div class="col-sm-8">
          <input type="password" class="form-control" id="passwordconfirm" parsley-trigger="change" parsley-required="true" parsley-minlength="6" parsley-type="alphanum" parsley-validation-minlength="1" parsley-equalto="#password">
        </div>
      </div>

      <div class="form-group">
        <label for="website" class="col-sm-4 control-label">Website</label>
        <div class="col-sm-8">
          <input type="text" class="form-control" id="website" parsley-trigger="change" parsley-minlength="4" parsley-type="url" parsley-validation-minlength="1">
        </div>
      </div>

      <div class="form-group">
        <label for="birthdate" class="col-sm-4 control-label">Birthdate</label>
        <div class="col-sm-8">
          <input type="text" class="form-control" id="birthdate" parsley-trigger="change" parsley-minlength="4" parsley-type="dateIso" parsley-validation-minlength="1" placeholder="YYYY-MM-DD">
        </div>
      </div>

      <div class="form-group">
        <label for="input05" class="col-sm-4 control-label">Message (20 chars min, 200 max)</label>
        <div class="col-sm-8">
          <textarea class="form-control" id="input05" rows="3" parsley-trigger="keyup" parsley-rangelength="[20,200]" parsley-validation-minlength="1"></textarea>
        </div>
      </div>

      <div class="form-group">
        <label for="input07" class="col-sm-4 control-label">Normal select box *</label>
        <div class="col-sm-8" id="selectbox">
          <select class="chosen-select form-control" id="input07" parsley-trigger="change" parsley-required="true" parsley-error-container="#selectbox">
            <option value="">Please choose</option>
            <option value="1">1</option>
            <option value="2">2</option>
            <option value="3">3</option>
            <option value="4">4</option>
            <option value="5">5</option>
          </select>
        </div>
      </div>

       <div class="form-group">
        <label for="input08" class="col-sm-4 control-label">Multiple select box *</label>
        <div class="col-sm-8" id="selectbox2">
          <select multiple class="chosen-select form-control" id="input08" parsley-trigger="change" parsley-required="true" parsley-error-container="#selectbox2">
            <option value="11">1</option>
            <option value="222">2</option>
            <option value="33">3</option>
            <option value="44">4</option>
            <option value="55">5</option>
          </select>
        </div>
      </div>

      <div class="form-group">
        <label class="col-sm-4 control-label">Check at least 2 checkboxes *</label>
        <div class="col-sm-8" id="myproperlabel">
          <div class="checkbox">
            <input type="checkbox" value="1" id="opt01" parsley-group="mygroup" parsley-trigger="change" parsley-required="true" parsley-mincheck="2" parsley-error-container="#myproperlabel .last">
            <label for="opt01">Option 1</label>
          </div>
          <div class="checkbox">
            <input type="checkbox" value="1" id="opt02" parsley-group="mygroup" parsley-trigger="change" parsley-required="true" parsley-mincheck="2" parsley-error-container="#myproperlabel .last">
            <label for="opt02">Option 2</label>
          </div>
          <div class="checkbox last">
            <input type="checkbox" value="1" id="opt03" parsley-group="mygroup" parsley-trigger="change" parsley-required="true" parsley-mincheck="2" parsley-error-container="#myproperlabel .last">
            <label for="opt03">Option 3</label>
          </div>
        </div>
      </div>

      <div class="form-group form-footer">
        <div class="col-sm-offset-4 col-sm-8">
          <button type="submit" class="btn btn-primary">Submit</button>
          <button type="reset" class="btn btn-default">Reset</button>
        </div>
      </div>

    </form>

  </div>
  // /tile body

</section>
// /tile

//****************************//
//*********** jquery *********//
//****************************//

//chosen select input
$(".chosen-select").chosen({disable_search_threshold: 10});