CODEWITHSUNDEEP
javascriptvalidation
Matt Murphy
Matt Murphy

Reputation: 5

Error messages not displaying for form validation Javascript

Not really sure what I did wrong. But my two of my errors do not display, the nPrice and nAmount. However, my name and nSmokes displays. I'm thinking it has something to do with the if else's multiple condition i'm using.

I'd really like to get your thoughts.

Thanks in advance.

function doValidate()
{

//alert("Working");

document.myForm.nPrice.value=parseFloat(document.myForm.nPrice.value);
document.myForm.nAmount.value=parseInt(document.myForm.nAmount.value);
document.myForm.nSmokes.value=parseInt(document.myForm.nSmokes.value);

//alert(document.myForm.nPrice.value);

//alert(document.myForm.nAmount.value);

//alert(document.myForm.nSmokes.value);



errorCount = 0;
errorMsg = ""

if( document.myForm.name.value == "") {

        errorMsg = errorMsg + "You need to enter a value!";
        document.getElementById('errors').innerHTML= errorMsg;
        errorCount++; 

}

if (document.myForm.nPrice.value < 0 && document.myForm.nPrice.value > 20.00) {

        errorMsg = errorMsg + "You need to enter a value between 0 and 20!";
        document.getElementById('errors').innerHTML= errorMsg;
        errorCount++; 
}

if (document.myForm.nAmount.value < 0 && document.myForm.nAmount.value > 40) {

        errorMsg = errorMsg + "You need to enter a value between 0 and 40!";
        document.getElementById('errors').innerHTML= errorMsg;
        errorCount++; 
}
if (document.myForm.nSmokes.value < 0) {

        errorMsg = errorMsg + "<br/>Either your doing a great job or you put in that you     smoked 0 today!";
        document.getElementById('errors').innerHTML= errorMsg;
        errorCount++; 
}

if (errorCount > 0) {
        return false;
} else {
        return true;
}
}

HTML

<form name="myForm" method="post" id="myForm" onsubmit="return doValidate();">

  <table width="600" border="1" cellspacing="4" cellpadding="4">
   <tr>
     <td colspan="2" align="center"><img src="quitSmoking.jpg"  width="278"/></td>
   </tr>
   <tr>
     <td colspan="2" align="center">Quit Smoking Calculator by Your Name</td>
  </tr>
   <tr>
    <td>Your Name</td>
    <td><input type="text" name="name" id="name"  />&nbsp;</td>
   </tr> 
   <tr>
     <td>Date you Quit</td>
     <td><input name="startDate" type="text"> 
   <input type="button" value="select" onclick="displayDatePicker('startDate');">&nbsp;</td>
    </tr>
     <tr>
       <td>Price of a pack</td>
      <td><input type="text" name="nPrice" id="nPrice" value="8.00" />&nbsp;</td>
     </tr>
       <tr>
       <td>How many in a pack</td>
       <td><input type="text" name="nAmount" id="nAmount" value="20" />&nbsp;</td>
     </tr>
     <tr>
       <td>Number of cigarettes you smoked a day</td>
       <td><input type="text" name="nSmokes" id="nSmokes" value="25" />&nbsp;</td>
     </tr>
     <tr>
      <td colspan="2" align="center"><input type="submit" name="btnSubmit" id="btnSubmit" value="Calculate Savings" /></td>
    </tr>
     <tr>
       <td colspan="2" align="center"><div id="errors"></div></td>
     </tr>
     <tr>
       <td id="rowResult" colspan="2" align="center">
       <input type="hidden" name="nResult" id="nResult" value="" />
       &nbsp;</td>
     </tr>
   </table>

    </form>

Upvotes: 0

Views: 261

Answers (2)

alxgb
alxgb

Reputation: 526

document.myForm.nPrice.value < 0 && document.myForm.nPrice.value > 20.00

How can a value be lower than 0 and bigger than 20? You are looking for an OR there.

document.myForm.nPrice.value < 0 || document.myForm.nPrice.value > 20.00

or between 0 to 20

document.myForm.nPrice.value > 0 && document.myForm.nPrice.value < 20.00

similar mistake you made for second if expression too.

Upvotes: 3

Christofer Eliasson
Christofer Eliasson

Reputation: 33875

This line will not work as you think:

document.myForm.nSmokes.value = parseInt(document.myForm.nSmokes.value);

The value will be turned back into a string as soon as you put the value back into the form again, which is essentially what you do with above line. Instead you need to store the parsed values in variables, and then use those variables in your validation.

var nSmokes = parseInt(document.myForm.nSmokes.value);

Then use it something like this:

if (nSmokes < 0) {

Further, you have an error in your logic, as you are using the && (AND) operator, rather than the || (OR) operator, which would make more sense.

Upvotes: 0

Related Questions