How to get validation to work properly on my input fields

Question

I have managed to get my fields to calculate properly but now I am trying to add some validation to them which is proving difficult. What I aim to do is make sure that the fields have to contain numbers only and have to be filled in.

function audience_details()
if(fields.length === 0) {
     var aud1, aud2, total;
     var aud1 = parseInt(document.getElementById("audience_1_field").value);
     var aud2 = parseInt(document.getElementById("audience_2_field").value);
     var reach = parseInt(document.getElementById("reach_field").value);
     var total = (aud1 + aud2 - reach ) / aud1 * 100 ;
     total_field.value =  parseFloat(total).toFixed(2) + '%';
     estimate.value =  parseFloat(total).toFixed(2) + '%';
}
else {
     //alert fields must be complete / contain numbers only!
}

any help would be lovely here is the form http://jsfiddle.net/pjf2v7b8/

You're missing `{` and `}` at for function, and what is `fields`? — Dhaval Marthak, Aug 18 '14 at 11:09
Hi! thanks for the swift reply. By fields i meant input fields for example : — kenbo, Aug 18 '14 at 11:12

score 1 · Answer 1 · answered Aug 18 '14 at 11:27

Here I am going to give the partial solution. Look at the javascript validation and demo fiddle.

function audience_details()
{
var temp = document.getElementById("audience_1_field").value;
var temp1 = document.getElementById("audience_2_field").value;
var temp2 = document.getElementById("reach_field").value;

if(temp == "" || temp == null)
{
    alert("please enter Audience 1 value");
}
else if(temp1 == "" || temp1 == null)
{
    alert("please enter Audience 2 value");
}
else if(temp2 == "" || temp2 == null)
{
    alert("please enter Total Reach value");
}
else
{
 var aud1, aud2, total;
 var aud1 = parseInt(document.getElementById("audience_1_field").value);
 var aud2 = parseInt(document.getElementById("audience_2_field").value);
 var reach = parseInt(document.getElementById("reach_field").value);
 var total = (((aud1 + aud2) - reach ) / aud1) * 100 ;  

  total_field =  parseFloat(total).toFixed(2) + '%';

  estimate =  parseFloat(total).toFixed(2) + '%';

  document.getElementById("total_field").value = total_field;
}   

}

SAMPLE DEMO

As I told above partial solution, Because I didn't add the numeric value validation in my solution. At present it will check whether they enter the value or not. If not it will through alert message. You try yourself for the numeric value validation.

Hi, Thank you for taking the time to respond this was along the right lines that i was looking for altho it wasn't just restricted to numbers. — kenbo, Aug 18 '14 at 12:42

score 1 · Accepted Answer · answered Aug 18 '14 at 12:16

Please try this answer :

function audience_details(){
     var aud1, aud2, total;
     if(document.getElementById("audience_1_field").value == "" || !onlyNos(document.getElementById("audience_1_field"))){
            alert("Please enter valid number in audience 1");
     }
     else if(document.getElementById("audience_2_field").value == "" || !onlyNos(document.getElementById("audience_2_field"))){

            alert("Please enter valid number in audience 2");
     }
     else if(document.getElementById("reach_field").value == "" || !onlyNos(document.getElementById("reach_field"))){
            alert("Please enter valid number in reache field");
     }
     else{
        var aud1 = parseInt(document.getElementById("audience_1_field").value);
        var aud2 = parseInt(document.getElementById("audience_2_field").value);
        var reach = parseInt(document.getElementById("reach_field").value);
        var total = (aud1 + aud2 - reach ) / aud1 * 100 ;
        total_field.value =  parseFloat(total).toFixed(2) + '%';
     }

}

    function onlyNos(e) {
        try {
            if (e) {
                var charCode = e.value;

                if (charCode.charCodeAt() > 31 && (charCode.charCodeAt() < 48 || charCode.charCodeAt() > 57)) 
                    return false;
                else { return true; }
            }
            else{return false;}
        }
        catch (err) {
            alert(err.Description);
        }
    }

How to get validation to work properly on my input fields

2 Answers2