CODEWITHSUNDEEP
javascriptphphtmlforms
sgt_johnny
sgt_johnny

Reputation: 329

Validate Form Inputs on a good and reliable way

On my page im working on, are a lot of input-forms.

I want to check the user inputs before submit.

Example

HTML/PHP

<input type="text" name="adress" id="adress">
<input type="text" name="amount" id="amount">

and actually im doing the following in Javascript

Javascript

function dataValidation() {
error=false;
var adress = document.getElementById('adress').value;
var amount = document.getElementById('adress').value;
if (adress == ""){
error=true;
}
if (amount >0 && amount < 999){
}
else {
error=true;
}
if (error == false){
document.forms["myForm"].submit();
}
}

So, basically this works fine for my, but the problem is, i have to create that function for every form, and add a IF for every field

So, im looking for a better solution

Idea 1 : Add a list, wich provides the types of input, like 

adress = not empty,
amount = >0 && <999,

and then create a function, which checks all fields with that list

Idea 2: Add a tag or something directly to the input field, what it should contain. and then create a function which checks all the fields

Does somebody have a Idea how this can be done, and would like to help/advise me?

Upvotes: 1

Views: 147

Answers (3)

Dinesh
Dinesh

Reputation: 4110

you could try this by jquery as: your html:

<input type="text" name="adress" id="adress">
<input type="text" name="amount" id="amount">
    <input type="button" id="check_input">

and apply jquery for all input field

 $("#check_input").click(function() {
       $("input").each(function() {
          var element = $(this);
       if(element.val() == "") {
          element.css("border","1px solid red");
          element.attr("placeholder","Field is empty"); 
          return false;
          }

          });
          });

Upvotes: 1

haris
haris

Reputation: 3875

You might wanna consider using HTML5.

HTML5 can save time writing JS validations. For example to validate an email address you could use the following:

<input type="email" name="email" required />

Notice the type="email" and required. Instead of using js for validating, you could use HTML5 form attributes with Regular Expression Patterns.

For example If I want to create an input field which accepts only one numbers and 3 uppercase letters, I can easily do with it using a RegEx pattern:

<input type="text" pattern="[0-9][A-Z]{3}">

Read a little bit more on HTML5 and RegEx. It could help you.

Upvotes: 0

himanshu
himanshu

Reputation: 1797

if you have multiple forms with same fields try to call validation externally it will reduce some of your work apart from that i dont know any other method so lets wait for others reply

Upvotes: 0

Related Questions