Follow

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use
Contact

How To Prevent Form Submission And Tell Users That Input Cannot Be Three Numbers

I have spent so many hours searching for either an HTML input tag or Javascript that prevents form submission when input is only 3 numbers.
I don’t want to use characters because my input field only requires numbers.

<input name="Code" value="000" onchange="leadingZeros(this)" onkeyup="leadingZeros(this)"
   onclick="leadingZeros(this)" autocomplete="off" id="myInput"   type='text' required=""   />

function leadingZeros(input) {
if(!isNaN(input.value) && input.value.length === 1) {
  input.value = '000' + input.value;
}

}

I am using the code above on my form to force the input of three zeros (000) before the numbers users provide in the input field.

MEDevel.com: Open-source for Healthcare and Education

Collecting and validating open-source software for healthcare, education, enterprise, development, medical imaging, medical records, and digital pathology.

Visit Medevel

Some users might forget to fill out that field and proceed to submit my form and the form will get submitted because it detects that the field isn’t empty.

Some users forget to fill out the field and I only get the three zeros (000) when the form gets submitted.

I want to prevent the form submission when they forget to input their numbers after the first three zeros and tell users that INPUT CAN NOT BE 3 NUMBERS.

That will remind them that the first three zeros had been in the input field and they still have to provide their numbers after it.

How can I do this, please?

>Solution :

You could use form validation. For instance, to force an input of three zeroes followed by one or several digits:

<input pattern="^000\d+$" required />
Add a comment

Leave a Reply

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use

Discover more from Dev solutions

Subscribe now to keep reading and get access to the full archive.

Continue reading