Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New to the CF scene
    Join Date
    Jan 2013
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Help with Javascript carrying forward information

    Hello everyone, I am new to this forum but i'm hoping you will all go easy on me! I am currently doing an e-commerce website for my course, and I have run into difficulty with the checkout page. Let me note, that this website only requires HTML, CSS, Javascript and cgi/perl (no php, ajax, etc). My web order structure is: frameset page-->
    products page-->address details-->control page-->confirmation page.

    Any how I am unable to carry forward the 'address details' values forward.

    Currently my codes are:


    Frameset page named "products2.html"
    Code:
    <HTML>
    
    <HEAD>
    
    <TITLE>Products Page</TITLE>
    
    </HEAD>
    
    <FRAMESET COLS="*,10" BORDER="0">
    
    <FRAME SRC="products.html">
    
    <FRAME SRC="control.htm">
    
    </FRAMESET>
    
    </HTML>
    products.html page:
    Code:
    	<javascript>
    	function processproducts() {
    
     products = document.forms["choices"]
    
     if(products.total.value=="" || products.total.value=="0")
    
      alert("You must select item and quantity!")
    
     else {
    
      controlForm = parent.frames[1].document.controlForm
    
      controlForm.total.value=products.total.value
    
      controlForm.myTextArea.value=products.myTextArea.value
    
      location.href="ship.html"
    
     }
    
    }	</script>
    
    	<form Action="" method="post"form name="choices" >
    
    	
    	<table>
    
    	<tr><td>The Value of your order in £s is:</td></tr>
    
    	<tr><td><input type=text name="total" size=12></td></tr>
    
    	<tr><td>Products Ordered:</tr></td>
    
    	<tr><td><textarea name="myTextArea" value="Blank" rows=6 cols=60>
    
    	</textarea></td><tr>
    
    	<tr><td><input type=button value="Sub-Total" onClick=submitOrder()></td></tr>
    
    	<tr><td><input type=reset value="Clear"></td></tr>
    	<tr><td><input type=button Name="next" value="Next" onClick=processproducts()></td></tr>
    
    	</table>
    
    	</form>
    ship.html
    Code:
    <script Language="JavaScript">
    function processship() {
      	ship = document.forms["shipDetails"]
    
     if(ship.firstName.value=="" || ship.firstName.value=="0"|| ship.lastName.value==""|| 
     ship.lastName.value=="0"|| ship.street.value==""|| ship.street.value=="0" || 
     ship.city.value=="0"|| ship.city.value==""|| ship.country.value=="0"|| ship.country.value==""|| 
     ship.postcode.value=="0"|| ship.postcode.value==""|| ship.phone.value==""|| 
     ship.phone.value=="0"|| ship.email.value==""|| ship.email.value=="0")
    
      alert("Error in shipping details, please correct")
    
     else{ 
    controlForm = parent.frames[1].document.controlForm
    	controlForm.lastName.value=ship.lastName.value
      controlForm.firstName.value=ship.firstName.value
      controlForm.street.value=ship.street.value
      controlForm.city.value=ship.city.value
      controlForm.country.value=ship.country.value
      controlForm.postcode.value=ship.postcode.value
      controlForm.phone.value=ship.phone.value
      controlForm.email.value=ship.email.value
      location.href="form3.htm"
    
     }
    }
    </script>
    
    <form Action="" form name="shipDetails"  method="post" action="">
    <p>First name: <input type="TEXT" name="firstName">
    Last name: <input type="TEXT" name="lastName">
     </p>
    <p>Street address:
     <input type="TEXT" name="street" size="50">
     </p>
    <p>City: <input type="TEXT" name="city"></p>
    <p>Country: <input type="TEXT" name="country">
     Postal code: <input type="TEXT" name="postcode"></p>
    <p>Phone number: <input type="TEXT" name="phone"></p>
    <p>E-mail address: <input type="TEXT" name="email" size="30">
     </p>
    <p></p>
    <input type=button name="next" value="Confirm Order" onClick=processship() >
    </form>
    controlForm.htm
    Code:
    <HTML>
    <HEAD>
    <SCRIPT LANGUAGE="JavaScript"><!--
    // --></SCRIPT>
    </HEAD>
    <BODY>
    <FORM ACTION="http://.../cgi/thanks.cgi"
     NAME="controlForm"
     METHOD="post" TARGET="_top">
    <INPUT TYPE="HIDDEN" NAME="firstName" VALUE="">
    <INPUT TYPE="HIDDEN" NAME="lastName" VALUE=""> 
    <INPUT TYPE="HIDDEN" NAME="street" VALUE="">
    <INPUT TYPE="HIDDEN" NAME="city" VALUE=""> 
    <INPUT TYPE="HIDDEN" NAME="postcode" VALUE="">
    <INPUT TYPE="HIDDEN" NAME="phone" VALUE=""> 
    <INPUT TYPE="HIDDEN" NAME="email" VALUE=""> 
    <INPUT TYPE="HIDDEN" NAME="total" VALUE="">
    <INPUT TYPE="HIDDEN" NAME="myTextArea" VALUE="">
    </FORM>
    </BODY>
    </HTML>
    My confirmation page will be generated by .cgi

    I would be very grateful if anyone could have a look and see where my coding has gone wrong especially as when I get to "ship.html" and click the submit button, it does not

  • #2
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,079
    Thanks
    203
    Thanked 2,542 Times in 2,520 Posts
    Be aware that the <frameset> tag is not supported in HTML5. In other words, is obsolete.

    <script language=javascript> is long deprecated and obsolete. Use <script type = "text/javascript"> instead (in fact also deprecated but still necessary for IE<9). The <!-- and //--> comment (hiding) tags have not been necessary since IE3 (i.e. since September 1997). If you see these in some published script it is a warning that you are looking at ancient and perhaps unreliable code.

    To pass data from one page to another will require you to use a cookie.

    Have you tried using your error console?

    David was a Hebrew king who was skilled at playing the liar.
    - Pupil's answer to Catholic Elementary School test.

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.

  • #3
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    26,027
    Thanks
    79
    Thanked 4,436 Times in 4,401 Posts
    Are you using a debugger? If not, way past time that you were.

    I would personally recommend using CHROME browser. Its debugger is, I think, the easiest to use.

    But you should also learn how to debug your code in other ways.

    Just for starters, you should change all the HIDDEN fields in controlform.html page to text fields, so you can *immediately* see if they are getting the values you think they should.

    An easy way to do that is to change <input type="hidden"> to <input xxtype="hidden">[/icode]. xxtype is meaningless and so will be ignored by the browser and all your fields will then be text fields, by default.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.


  •  

    Posting Permissions

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