How to Handle Maxlength For HTML5 Input Type Number

How to Handle Maxlength For HTML5 Input Type Number

by

Happy Holloween everyone! Despite busy schedule due to a holiday,  I would love to share this solution on How to Handle Maxlength HTML5 Input Type Number. Basically, Maxlength will only work for strings. But using the element of type “number” are only used to let the user enter a number. It a built-in validation to reject non-numerical entries.

How to Handle Maxlength HTML5 Input Type Number
How to Handle Maxlength For HTML5 Input Type Number

The Code snippet below that I found on the internet is really working. This time I will share this to all especially those individuals who encounter the same problem.

 <div class="col-md-6">
	<label class="col-md-4 control-label" for=
	"guardianAdd">Contact No. </label>

	<div class="col-md-8">
	  <input class="form-control input-sm" id="guardianAdd" name="guardianAdd" 
              type="number" placeholder="Guardian/Parent Contact Number" required 
               oninput="javascript: if (this.value.length > this.maxLength) this.value = this.value.slice(0, this.maxLength);"  maxlength = "11">
       </div>
</div>

Hopefully, this would really help you a lot. And If you have any questions or suggestion about this topic please feel free to contact me on our contact page.

The related article you may like.

 

Leave a Comment