Jump to content

Why do I keep getting an empty alert box?

- - - - -

This topic has been archived. This means that you cannot reply to this topic.
7 replies to this topic

#1
system32

system32

    Newbie

  • Members
  • PipPip
  • 24 posts
I have been working on this for a month now as an exercise and I am still having problems. Every time I get a user to fully validate all information I keep getting an empty alert box. Why is it showing up empty and not with a total amount? Im 95% sure my code is correct: This is my code:

<html>
<head>
<script language="javascript" type="text/javascript">
    
    //function to show province
    function checkProvince()
    {
        var myForm = document.pizzaForm;    
        if (myForm.province.value == "Nunavut" || myForm.province.value == "Yukon")
            {
                alert("We are sorry but we do not deliver here.");
            }
    }
    
    //main function to validate all errors
    function checkName()
    {
        //variable for the alert box to show all errors
        var errMessage = " ";
        //variable to shorten form tag
        var myForm = document.pizzaForm;
        //variable to validate phone number
        var rePhone = /^\(?(\d{3})\)?[\.\-\/\s]?(\d{3})[\.\-\/\s]?(\d{4})$/ ;
        //variable to validate postal code
        var rePostal = /^[A-Z][0-9][A-Z][0-9][A-Z][0-9]$/;
        //validate email
        //var reEmail = /^\D+\@\D+\.\D+$/;
        //variable to shorten telephone tag
        var validPhone = document.pizzaForm.telephone;
        //variable to shorten postalcode tag
        var validPostal = document.pizzaForm.postalCode;
        //variable to shorten pizza number value tag
        var pizzaAmount = document.pizzaForm.pizzaNumber.value
        //var validEmail = document.pizzaForm.email;
        //variable to add the final amount of the order
        var sum = finalAmount + toppingAmount;
        //variable to store final order amount as a string
        var summ = "";
        //variable to show the cost of the pizza times the number ordered
        var finalAmount = "";
        //variable to store the total cost or all toppings
        var toppingAmount = "";
        //summ now holds the final order and converts to a string
        summ = sum.toString();
        
        //validate all form fields
        if (myForm.firstName.value == "" || myForm.lastName.value == "")
            {
                errMessage += "Please type in your name\n";
            }
            if (myForm.address.value == "")
            {
                errMessage += "Please type in your address\n";
            }
            if (myForm.city.value == "") 
            {
                errMessage += "Please type in your city\n";
            }
            if (myForm.postalCode.value == "")
            {
                errMessage += "Please type in your postal code\n";    
            }
            if (myForm.province.value == "")
            {
                errMessage += "Please select a province\n";
            }
            if (myForm.telephone.value == "")
            {
                errMessage += "Please type in a phone number\n";
            }
            if (myForm.email.value == "")
            {
                errMessage += "Please type in your email\n";
            }

            if (!rePhone.test(validPhone.value))
            {
                errMessage += "Please type in a valid phone number, such as: 519-555-5555\n";
            }
            if (!rePostal.test(validPostal.value.toUpperCase()))
            {
                errMessage += "Please type in a valid postal code, such as: N2N3M8\n";
            }
            /*if (!reEmail.test(vaildEmail.value))
            {
                errMessage += "Please enter a vaild email such as: example@example.com\n";
            }*/
            //if no number is typed then show error
            if (isNaN(myForm.pizzaNumber.value))
            {
                errMessage += "Please enter a valid number of pizzas\n";
            }
            else if (myForm.pizzaNumber.value == 0)
            {
                errMessage += "You must order at least one pizza\n";    
            }
            else if (myForm.pizzaNumber.value > 10)
            {
                alert("Please contact this number to place orders larger than 10")
            }
            
            //Check to see the if the Pizza Size has been selected
             if (!(document.pizzaForm.pizzaSize[0].checked) && 
                                                !(document.pizzaForm.pizzaSize[1].checked) && 
                                                !(document.pizzaForm.pizzaSize[2].checked) && 
                                                !(document.pizzaForm.pizzaSize[3].checked))
             {
                 errMessage += "You must select a pizza size\n";
             }
             
             
             //calculate order
             if (!errMessage && (document.pizzaForm.pizzaSize[0].checked))
             {
                 finalAmount = pizzaAmount * 5;
                     if (document.pizzaForm.extra[0].checked)
                    {
                        finalAmount = ((pizzaAmount * 5) + 2);
                    }
             }
             else if (!errMessage && (document.pizzaForm.pizzaSize[1].checked))
             {
                 finalAmount = pizzaAmount * 10;
                     if (document.pizzaForm.extra[0].checked)
                    {
                        finalAmount = ((pizzaAmount * 10) + 2);
                    }
             }
             else if (!errMessage && (document.pizzaForm.pizzaSize[2].checked))
             {
                 finalAmount = pizzaAmount * 15;
                     if (document.pizzaForm.extra[0].checked)
                    {
                        finalAmount = ((pizzaAmount * 15) + 2);
                    }
             }
             else if (!errMessage && (document.pizzaForm.pizzaSize[3].checked))
             {
                 finalAmount = pizzaAmount * 20;
                     if (document.pizzaForm.extra[0].checked)
                    {
                        finalAmount = ((pizzaAmount * 20) + 2);
                    }
             }
             
             
             
        var boxCheck = 0;
        //loop the topping amount to see if it has been checked
        for (var i=1;i<=11;i++)
        {
            //boxname has a value of topping plus a number incremented by 1
            boxName = "topping" + i;
            //toppingAmount now holds a value of the amount of box's checked times 0.75
            toppingAmount = boxCheck * 0.75;
            if (document.pizzaForm[boxName].checked)
            {
                //if a box has been checked then increment
                boxCheck++;
            }
            
        }
        
        if (boxCheck == 0)
        {
            errMessage += "you must select at least one topping\n";
        }
        else if (boxCheck > 5)
        {
            errMessage += "You can only select a maximum of 5 toppings\n";
        }
        
        //if there is no error box show the total order amount
        //THIS WILL ONLY SHOW AN EMPTY ALERT BOX
        //NOT SURE WHY
        if (errMessage == "")
        {
            alert(summ);
            //return true;
        }
        //if there are errors show error alert box
            alert(errMessage);
            //return false;                                    
    }
    
</script>

<title>Order Exercise</title>
</head>

<body>
<!--Personal Information Groupbox -->
<h1>Pizzaria</h1>
<form action="WF/assign2/pizzaForm" method="get" name="pizzaForm" id="pizzaForm" onSubmit="checkName()">
<table width="475" border="0">
    <tr>
      <td width="329">
<fieldset style="width:250px">
<legend align="top">Personal Information</legend>
First Name <input name="firstName" type="text" id="firstName"  /><br />
Last Name <input name="lastName" type="text" id="lastName"  /><br/>
Address <input name="address" type="text" id="address"  /><br />
City <input name="city" type="text" id="city"  /><br />
Province <select name="province" onClick="checkProvince()">
  <option value="" >Please Select a Province</option>
  <option>Alberta</option>
  <option>British Columbia</option>
  <option>Manitoba</option>
  <option>New Brunswick</option>
  <option>Newfoundland and Labrador</option>
  <option>Northwest Territories</option>
  <option>Nova Scotia</option>
  <option > Nunavut</option>
  <option>Ontario</option>
  <option>Prince Edward Island</option>
  <option>Québec</option>
  <option>Saskatchewan</option>
  <option >Yukon</option>
</select><br/>
Postal Code <input name="postalCode" size="9" maxlength="6" type="text" id="postalCode"  /><br/>
Telephone <input name="telephone" type="text" id="telephone"  /><br />
Email <input name="email" type="email" id="email" />
</fieldset>

<!--Order Information Groupbox -->
</td>
      <td width="130">
<fieldset style="width:300px">
<legend align="top">Order Information</legend>
Number Of Pizza's <input name="pizzaNumber" maxlength="2" type="text" id="pizzaNumber"  /><br /><br  />
Size<br />
<label>
      <input name="pizzaSize" type="radio" value="radio"  />
      Small</label>
    <br />
    <label>
      <input type="radio" name="pizzaSize" value="radio"  />
      Medium</label>
    <br />
    <label>
      <input type="radio" name="pizzaSize" value="radio"  />
      Large</label>
    <br />
    <label>
      <input type="radio" name="pizzaSize" value="radio" />
      Extra Large</label><br  /><br /><br />
Crust Type <select name="crustType">
<option>Hand-Tossed Pizza</option>
<option>Pan Pizza</option>
<option>Stuffed Crust</option>
<option>Thin Crust</option>
</select><br /><br />
Toppings<br />
<input name="topping1" type="checkbox" id="sausage" />Sausage
<input name="topping2" type="checkbox" id="pepperoni" />Pepperoni
<input name="topping3" type="checkbox" id="beef" />Beef
<input name="topping4" type="checkbox" id="bacon" />Bacon<br />
<input name="topping5" type="checkbox" id="chicken" />Chicken
<input name="topping6" type="checkbox" id="ham" />Ham
<input name="topping7" type="checkbox" id="olives" />Olives
<input name="topping8" type="checkbox" id="pepper" />Peppers<br />
<input name="topping9" type="checkbox" id="tomatoes" />Tomatoes
<input name="topping10" type="checkbox" id="mushrooms" />Mushrooms
<input name="topping11" type="checkbox" id="pinapple" />Pinapple<br /><br />
Extra<br />
<input name="extra" type="checkbox" id="extra" />Add small (5 wings) for an additional $2.00
</fieldset>
<input name="Submit" type="button" id="submit" value="Submit"  onClick="checkName()" />
<input name="Reset" type="reset" id="reset" value="Reset" />
</td>
    </tr>
  </table>
</form>
</body>
</html>


#2
Vswe

Vswe

    Writes binary right handed and hex left handed

  • Members
  • PipPipPipPipPipPipPipPipPip
  • 9,552 posts
        var sum = finalAmount + toppingAmount;
finalAmount doesn't have a value neither do toppingAmount which means sum doesn't have it either and therefore summ will also be empty which will result in the empty box.

#3
system32

system32

    Newbie

  • Members
  • PipPip
  • 24 posts
I have the variables declaried at the top as:

var finalAmount = "";
var toppingAmount = "";

var pizzaAmount = document.pizzaForm.pizzaNumber.value;

And in my code as:

finalAmount = pizzaAmount * 5;
toppingAmount = boxCheck * 0.75;

Is there something I am doing wrong? Wont the value from the textbox get multipled? Im pretty sure they are declared. Is there something wrong with my if statement?

#4
Vswe

Vswe

    Writes binary right handed and hex left handed

  • Members
  • PipPipPipPipPipPipPipPipPip
  • 9,552 posts
At the time you do this:

        var sum = finalAmount + toppingAmount;

both finalAmount and toppingAmount are equals to nothing and therefor sum will also be nothing even though you're changing finalAmount and toppingAmount afterwards, it won't change the sum.

#5
system32

system32

    Newbie

  • Members
  • PipPip
  • 24 posts
thanks for the reply. How would I change this so it works, so I get a sum showing up?

Thanks

#6
Vswe

Vswe

    Writes binary right handed and hex left handed

  • Members
  • PipPipPipPipPipPipPipPipPip
  • 9,552 posts
moving this part to after finalAmount and toppingAmount have been set to the right values.
var sum = finalAmount + toppingAmount;
        summ = sum.toString();


#7
system32

system32

    Newbie

  • Members
  • PipPip
  • 24 posts
I found out why I kept getting an empty alert box, because my var errMessage = " "; had a space in it:P. Now I dont get anything to show up after I click the submit button, and I have moved the variables to the position as you have mentioned.

#8
DarkLordoftheMonkeys

DarkLordoftheMonkeys

    Programming Professional

  • Members
  • PipPipPipPipPip
  • 255 posts
document.pizzaForm should be document.getElementById('pizzaForm') or document.forms.pizzaForm, preferably the former. When you write document.pizzaForm you are telling the browser "Get the pizzaForm property of the document object." document has no property called pizzaForm, but it does have a method called getElementById().
Life's too short to be cool. Be a nerd.