How to apply min and max on textarea?

Question

Is there a way in HTML5 forms to add a min and max character to a textarea? It seems I can apply it to a regular input using pattern.

<input pattern=".{3,}" title="3 characters minimum">

Am I looking at a jquery solution?

Answer 1

HTML5 solution, min 5, max 20 characters

just set the attribute maxlength="20" and minlength="5" to the textarea tag

http://jsfiddle.net/xhqsB/603/

   <form>
      <textarea maxlength="20" minlength="5"></textarea>
      <input type="submit" value="Check"></input>
   </form>

Answer 2

For max: see below code
Use maxlength for maximum character.

maxlength="nuber_of_characters"

Source: http://www.w3.org/TR/html5/forms.html#the-textarea-element

For min: source
Use Javascript as below:
use id attribute in <textarea>. Set id attribute to minle(for eg) ie id="minle"

<textarea rows="10" cols="80" maxlength="200" required id="minle" >
</textarea> 

and put following js code segment in your form tag

  <form action="mango.php" method="post" id="form12" onsubmit="var text = document.getElementById('minle').value; if(text.length < 80) { alert('put more info!'); return false; } return true;">

This allow user to input no. of characters from 80 to 200.

Answer 3

HTML5 solution, min 5, max 10 characters

http://jsfiddle.net/xhqsB/102/

<form>
  <input pattern=".{5,10}">
  <input type="submit" value="Check"></input>
</form>