maxxxx 0 Newbie Poster

I have this function that seems not to be working. If I click on the send order button and the first name field is not filled, it should say first name not entered. But it's not. I put comment in the javascript where I'm tring to fix.

Thanks in advance.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
 <script type="text/javascript">


function formValidator(){
/// this var is not working and don't know why
    var firstName = document.getElementById('firstname').value;
    if (firstName == "") {
        document.getElementById('firstAl').innerHTML = "first name not entered";

    }
    else {
        document.getElementById('firstAl').innerHTML = "";

    }
	
	
//pay no attention to script below//	
	
   var lastName = document.getElementById('lastname').value;
   if (lastName == ""){
     alert("last name not entered");
    }
   var streetNumber = document.getElementById('streetnumber').value;
   if (streetNumber == ""){
     alert("street number not entered");
    }
   var streetname = document.getElementById('streetname').value;
   if (streetNamme == ""){
     alert("street name not entered");
    }
   var city = document.getElementById('city').value;
   if (city == ""){
     alert("city name not entered");
    }
   var postalCode = document.getElementById('postalcode').value;
   if (postalCode == ""){
     alert("postal code not entered");
    }
   var phoneNumbera = document.getElementById('phonenumbera').value;
   if (phoneNumbera == ""){
     alert("phone number not entered");
    }
   var phoneNumberb = document.getElementById('phonenumberb').value;
   if (phoneNumberb == ""){
     alert("phone number not entered");
    }
   var email = document.getElementById('email').value;
   if (email == ""){
     alert("email not entered");
    }
   var submit = document.getElementById('submit').value;
    }

  function comments()
 {
 (document.getElementById("comments").value);
 }
//// next step of javascript to work on after
 function addTotal() {
     document.getElementById("hamSub").value = 2.99 * document.getElementById("hamQuant").value;
               

 }

  function howtoget(){

var pickup = document.getElementById("pickup").checked==true
   
   if (pickup == "")
     alert("Your food will be delivered in 20 minutes");

}	
	
 function sendOrder() {
     alert('You have not ordered anything yet');
     formValidator();
	document.getElementById('send').reset(); 

       

}
 
 
 
 

</script>

</head>

<body>
<form>

<center>
  <B>The JavaScript Eatery
</center>
<form>
  <table align="center" border="1">
    <tbody>
      <tr>
        <td><center>
            <b>vital information</b>
          </center>
          <table>
            <tbody>
              <tr>
<td width="121">first name</td>
<td width="289"><input type="text" size="15" maxlength="50" id="firstname"><br /><div id="firstAl"></div></td>
</tr>
<tr>
<td>last name</td>
<td><input type="text" size="15" maxlength="50" id="lastname"></td>
</tr>
<tr>
<td>street number</td>
<td><input type="text" size="40" maxlength="35" id="streetnumber"></td>
</tr>
<tr>
<td>street name</td>
<td><input type="text" size="40" maxlength="35" id="streetname"></td>
</tr>
<tr>
<td>city</td>
<td><input type="text" size="25" maxlength="21" id="city"></td>
</tr>
<tr>
<td>postal code</td>
<td><input type="text" size="25" maxlength="21" id="postalcode"></td>
</tr>
<tr>
<td>phone number</td>
<td><input id="phonenumbera"  size="4" />
                 -
<input id="phonenumberb"  size="5" /></td>
</tr>
<tr>
<td>email address</td>
<td><input type="text" size="15" id="email"></td>
</tr>
            </tbody>
          </table></td>
        <td width="266" valign="top"><p>&nbsp;</p>
<p>&nbsp;</p>
<p><b>comments / special request</b><br />
<textarea rows="10" cols="35"id="comments" ></textarea>
        </td>
      </tr>
    </tbody>
  </table>
  <hr />
  <table width="90%">
    <tbody>
      <tr>
        <td><table>
            <tbody>
              <tr>
                <th>item</th>
                <th>price</th>
                <th>quantity</th>
                <th>sub-total</th>
              </tr>
              <tr align="middle">
                <td align="left">Hamberger</td>
                <td><input id="hamburger" size="7" value="$2.99" /></td>
                <td><input id="hamQuant" size="3" /></td>
                <td><input id="hamSub" size="6" /></td>
              </tr>
              <tr align="middle">
                <td align="left">Cheeseburger</td>
                <td><input size="7" value="$3.99" /></td>
                <td><input size="3" /></td>
                <td><input size="6" /></td>
              </tr>
              <tr align="middle">
                <td align="left">Chicken Burger</td>
                <td><input size="7" value="$4.99" /></td>
                <td><input size="3" /></td>
                <td><input size="6" /></td>
              </tr>
            </tbody>
          </table></td>
        <td align="right"><table>
            <tbody>
              <tr>
                <th>item</th>
                <th>price</th>
                <th>quantity</th>
                <th>sub-total</th>
              </tr>
              <tr align="middle">
                <td align="left">French Fries</td>
                <td><input size="7" value="$2.99" /></td>
                <td><input size="3" /></td>
                <td><input size="6" /></td>
              </tr>
              <tr align="middle">
                <td align="left"><input type="checkbox" />
                  gravy</td>
                <td><input size="7" value="$0.50" /></td>
                <td><input size="3" /></td>
                <td><input size="6" /></td>
              </tr>
              <tr align="middle">
                <td align="left"><input type="checkbox" />
                  chilli</td>
                <td><input size="7" value="$1.99" /></td>
                <td><input size="3" /></td>
                <td><input size="6" /></td>
              </tr>
            </tbody>
          </table></td>
      </tr>
      <tr>
        <td colspan="2"><table align="center">
            <tbody>
              <tr>
                <td>subtotal</td>
                <td><input size="6" /></td>
              </tr>
              <tr>
                <td>pst 7%</td>
                <td><input size="6" /></td>
              </tr>
              <tr>
                <td>gst 5%</td>
                <td><input size="6" /></td>
              </tr>
              <tr>
                <td>total</td>
                <td><input size="6" /></td>
              </tr>
              <tr>
                <td colspan="2"><input type="button" value="total up order" onclick="addTotal()" />
                </td>
              </tr>
            </tbody>
          </table></td>
      </tr>
    </tbody>
  </table>
  <hr />
  <table width="80%" align="center">
    <tbody>
      <tr>
        <td><table>
            <tbody>
              <tr align="middle">
                <td>Payment</td>
                <td>card number</td>
                <td>expiration mm/yy</td>
              </tr>
              <tr align="middle">
                <td><select>
                    <option selected="selected">cash</option>
                    <option>master card</option>
                    <option>visa</option>
                  </select>
                </td>
                <td><input />
                </td>
                <td><select>
                    <option selected="selected">01</option>
                    <option>02</option>
                    <option>03</option>
                    <option>04</option>
                    <option>05</option>
                    <option>06</option>
                    <option>07</option>
                    <option>08</option>
                    <option>09</option>
                    <option>10</option>
                    <option>11</option>
                    <option>12</option>
                  </select>
                  <select>
                    <option selected="selected">03</option>
                    <option>04</option>
                    <option>05</option>
                    <option>06</option>
                    <option>07</option>
                    <option>08</option>
                    <option>09</option>
                  </select>
                </td>
              </tr>
            </tbody>
          </table></td>
        <td align="middle"><table>
            <tbody>
              <tr>
                <td><input type="radio" NAME="radio" value="Your food will be ready for pickup in 10 minutes" id="pickup" onClick="alert(value)"></td>
                <td>pickup</td>
              </tr>
              <tr>
                <td><input type="radio" NAME="radio" value="Your food will be ready for delivery in 20 minutes" id="delivery" onClick="alert(value)"></td>
                <td>delivery</td>
              </tr>
              <tr>
                <td><input type="radio" NAME="radio" value="Your table will be ready in 5 minutes" id="eatin" onClick="alert(value)"></td>
                <td>eat in</td>
              </tr>
            </tbody>
          </table></td>
      </tr>
    </tbody>
  </table>
  <center>
  
            
      <input type="reset" id="cancel"  name="clear" value="clear order"/>

   <input type="button" id="send" value="send order" onclick="sendOrder()" />

  </center>
</form>

<p>&nbsp;</p>
<p><asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server"></asp:Content></p>
<p>&nbsp;</p>



</form>
</body>
</html>
Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts learning and sharing knowledge.