SitePoint Sponsor

User Tag List

Results 1 to 2 of 2
  1. #1
    SitePoint Member
    Join Date
    Apr 2010
    Posts
    1
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    I'm having a problem creating a Javascript form. Can someone tell me what wrong?

    Code HTML4Strict:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    <head>
        <title>
         Project 2
        </title>    
        <meta http-equiv="content-type" content="text/html; charset=utf-8" />
        <meta http-equiv="content-language" content="en-us" />
        <link rel="stylesheet" href="../jsfiles/js_styles.css" type="text/css" />
     
    <script type="text/javascript">
    /* <![CDATA[ */
    function checkForNumber(fieldValue) {
    var numberCheck = isNaN(fieldValue);
    if (numberCheck == true) {
    window.alert("You must enter a numeric value!");
    return false;
    }
    return true;
    }
    function calculate() 
      var shipping = 0;
      var total = 0; {
      if (document.forms[0].hand_tool.value != document.forms[0].hand_tool.value == true)
        (document.forms[0]item1.value == 20); {
      && document.forms[0].shipping.value == (shipping + 5); {
      && (document.forms[0].total.value = document.forms[0].hand_tool.value + document.forms[0].shipping.value)
          }
        }   
    function confirmSubmit() {
      if (document.forms[0].first_name.value = "null") {
      window.alert("You have not entered the requested Customer Information.");
      return false;
      }
      else if (document.forms[0].last_name.value = "none" || document.forms[0].city.value = "" || document.forms[0].state.value = "none") {
      window.alert("You have not entered the requested Customer Information.");
      return false;
      }
      var pmntMethod = false
      for (var j=0; j<3; ++j) {
          if (document.forms[0].credit_card[j].checked == true) {
              pmntMethod = true;
              break;
              }
      }
      if (pmntMethod != true) {
          window.alert("You must select a method of payment.");
          return false;
      }
    return true;
    }
    function confirmReset() {
      var resetForm = window.confirm("Are you sure you want to reset the form?");
      if (resetForm == true)
          return true;
      return false;
      }
    /* ]]> */
    </script>
    </head>
     
      <body> 
      <!-- Your XHTML here -->
    <h1>Purchase Order</h1>
    <form action="FormProcessor.html" method="get" enctype="application/x-www-form-urlencoded" onsubmit="return confirmSubmit();" onreset="return confirmReset();">    
    <h3>Products</h3>
    <table>
    <tr>
      <td>  
    <p>Hand Tools <br />$20.00<img src="handtools.gif" alt="Hand Tools" class="img" /></p>
      </td>
      <td>
      <select name="hand_tool" size="1">
          <option value="hand_tool">Hand Tool</option>
          <option value="saw">Saw</option>
          <option value="hammer">Hammer</option>
          <option value="screwdriver">Screwdriver</option>
          <option value="wrench">Wrench</option>
          <option value="pliers">Pliers</option>
          </select>
      </td>
      <td>
      <p>Power Tools <br />$30.00<img src="powertools.gif" alt="Power Tools" class="img" /></p>
      </td>
      <td>      
      <select name="power_tool" size="1">
          <option value="power_tool">Power Tool</option>
          <option value="circular_saw">Circular Saw</option>
          <option value="sabre_saw">Sabre Saw</option>
          <option value="drill">Drill</option>
          <option value="belt_sander">Belt Sander</option>
          <option value="table_saw">Table Saw</option>
        </select>
      </td> 
    </tr>
    </table>
     
    <h3>Shipping Fees</h3>
    <table>
      <tr>
      <td>Item 1: <input type="text" name="item1" value="" onchange="calculate();" /></td>
      <td>Item 2: <input type="text" name="itme2" value="" onchange="calculate()" /></td>
      </tr>
      <tr>
      <td>Shipping: <input type="text" name="shipping" value="" /></td>
      <td>Total: <input type="text" name="total" value="" /></td>
      </tr> 
    </table> 
    <h3>Customer Information</h3>
      <p>First Name
        <input type="text" name="first_name" value="FirstName" onclick="document.forms[0].first_name.value = '';" onchange="confirmSubmit();"/>  
      Last Name
        <input type="text" name="last_name" value="LastName" onclick="document.forms[0].last_name.value = '';" onchange="confirmSubmit();" /></p>
      <p>Street Address 1 
        <input type="text" name="address1" value="Address1" onclick="document.forms[0].address1.value = '';" onchange="confirmSubmit();" /></p>
      <p>City 
        <input type="text" name="city" value="City" onclick="document.forms[0].city.value = '';" onchange="confirmSubmit();" />
      State 
        <input type="text" name="state" value="State" onclick="document.forms[0].state.value = '';" onchange="confirmSubmit();" />
      Zip 
        <input type="text" name="zip" value="Zip" onchange="return checkForNumber(this.value);" onclick="document.forms[0].zip.value = '';" /></p>
      <p>Phone
    		<input type="text" name="phone" value="Phone" onchange="return checkForNumber(this.value);" onclick="document.forms[0].phone.value = '';" />
    	Fax
        <input type="text" name="fax" value="Fax" onclick="document.forms[0].fax.value = '';" onchange="return checkForNumber(this.value);" /></p>
     
      <p>Payment Method? 
      <input type="radio" name="credit_card" />Visa
     
      <input type="radio" name="credit_card" />MasterCard
     
      <input type="radio" name="credit_card" />American Express</p>
      <p>Credit Card Number<input type="text" name="cardNumber" value="CardNumber" size="50" onclick="document.forms[0].cardNumber.value = '';" onchange="return checkForNumber(this.value);" /></p>
     
    <table>
    <tr>
      <td>  
    <p>Expiration Month</p>
      </td>
      <td>
      <select name="month" size="1" style="width: 200px">
          <option value="months">Month</option>
          <option value="january">January</option>
          <option value="february">February</option>
          <option value="march">March</option>
          <option value="april">April</option>
          <option value="may">May</option>
          <option value="june">June</option>
          <option value="july">July</option>
          <option value="august">August</option>
          <option value="september">September</option>
          <option value="october">October</option>
          <option value="november">November</option>
          <option value="december">December</option>
          </select>
      </td>
      <td>
     
      <p>Expiration Year</p>
      </td>
      <td>      
      <select name="expiration" size="1">
          <option value="2009">2009</option>
          <option value="2010">2010</option>
          <option value="2011">2011</option>
          <option value="2012">2012</option>
          <option value="2013">2013</option>
          <option value="2014">2014</option>
        </select>
      </td> 
    </tr>
    </table>
     
    <p><input type="image" alt="Graphical image of a submit button" src="submit.gif" onchange="confirmSubmit()" /></p>
    <p><input type="reset" value="Reset Purchase Order Form" onchange="confirmReset();" /></p>    
    </form>    
     
     
    <!-- your XHTML validation icon-->  
    <p>
        <a href="http://validator.w3.org/check?uri=referer"><img
            src="http://www.w3.org/Icons/valid-xhtml10"
            alt="Valid XHTML 1.0 Strict" height="31" width="88" 
            style="border: 0px;" /></a>
        <a href="http://jigsaw.w3.org/css-validator/check/referer">
        <img src="http://www.austincc.edu/jscholl/images/vcss.png" 
        alt="Valid CSS!" height="31" width="88" style="border: 0px;" /></a>       
    </p>
     
      </body>
      </html>
    Last edited by Mittineague; Apr 25, 2011 at 16:44. Reason: reformatting bbcode tags

  2. #2
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,526
    Mentioned
    83 Post(s)
    Tagged
    3 Thread(s)
    The calculate function is missing an opening brace for the function, and the code inside the calculate function is severely broken.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •