Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to apply min and max on textarea?

Tags:

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?

like image 418
LeBlaireau Avatar asked Aug 12 '13 10:08

LeBlaireau


People also ask

How do you set a textarea limit?

The HTML <Textarea>maxlength attribute is used to specify the maximum number of characters enters into the Textarea element. Attribute Value: number: It contains single value number which allows the maximum number of character in Textarea element. Its default value is 524288.

Can I use textarea Maxlength?

There is no native max-length attribute for textareas.

Can we use value attribute in textarea?

<textarea> does not support the value attribute.


2 Answers

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>
like image 182
ladriangb Avatar answered Oct 13 '22 23:10

ladriangb


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.

like image 22
Sohel Ahmed Mesaniya Avatar answered Oct 13 '22 23:10

Sohel Ahmed Mesaniya