Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Bootstrap - How to use validation states on a <textarea>

Bootstrap allows for validation states for input inside of forms, using class="form-group has-error". But this doesn't work with <textarea>, and oddly enough neither does the help-inline, any help?

Edit: This is the full input group :

<div class="form-group">
  <label for="desc" class="col-sm-2 control-label">Description:*</label>
  <div class="col-sm-10">
    <textarea autocomplete="off" class="form-control" rows="5" name="desc" id="desc"></textarea>
  </div>
</div>
like image 240
Ian Woodfill Avatar asked Oct 07 '14 01:10

Ian Woodfill


1 Answers

You could add the class form-control to the textarea element.

Example Here

<div class="form-group has-error">
    <textarea class="form-control"></textarea>
</div>

The selector used for this is .has-error .form-control. Here is the default styling too:

.has-error .form-control {
    border-color: #a94442;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
}
like image 178
Josh Crozier Avatar answered Sep 28 '22 10:09

Josh Crozier