www.webdeveloper.com
Results 1 to 3 of 3

Thread: submit and show button will not work

  1. #1
    Join Date
    Sep 2013
    Posts
    26

    submit and show button will not work

    Sorry to keep bugging you but could someone look at this for me. I am not understanding it. Do I need a separate page for the previous and next forms. Here is my code now. I know there are a lot of mistakes but I am trying. Any help would be greatly appreciated. Thank you http://www.webdeveloper.com/forum/im...lies/smile.gif

    First Page

    Code:
    <head>
    <title>CarRental</title>
    <meta http-equiv="content-type" content="text/html;
    charset=iso-8859-1" />
    <script type="text/javascript" src="ProductInfo.html"></script>
    </head>
    <body>
    <h1>Car Rental</h1>
    <h2>Reservations</h2>
    <form action=""method="get" enctype="application/x-www-form-urlencoded">
    <p><input type="button" name="Show" value=
    " Show" onclick="nextForm()" /> an existing reservation or create a new one below.</p>
    <h2>Name and Address</h2>
    <p>First Name
    <input type="text" name="name" size="30" />
    Last Name
    <input type="text" name="name" size="30" /></p>
    <p>Street Address 1
    <input type="text" name="address" size="50" /></p>
    <p>Street Address 2
    <input type="text" name="address" size="50" /></p>
    <p>City
    <input type="text" name="city" size="25" />
    State <input type="text"
    name="state" size="5" maxlength="2" />
    Zip <input type="text" name=
    "zip" size="15" maxlength="5" /></p>
    <p>Phone
    <input type="text" name="telephone" size="20" />
    Fax
    <input type="text" name="Fax" size="20" /></p>
    <h2>Reservation Request</h2>
    <p>Pickup Date
    <select name="month">
    <option value="Jan">Jan</option>
    <option value="Feb">Feb</option>
    <option value="Mar">Mar</option>
    <option value="Apr">Apr</option>
    <option value="May">May</option>
    <option value="Jun">Jun</option>
    <option value="Jul">Jul</option>
    <option value="Aug">Aug</option>
    <option value="Sep">Sep</option>
    <option value="Oct">Oct</option>
    <option value="Nov">Nov</option>
    <option value="Dec">Dec</option>
    </select>
    <select name="Day">
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
    <option value="6">6</option>
    <option value="7">7</option>
    <option value="8">8</option>
    <option value="9">9</option>
    <option value="10">10</option>
    <option value="11">11</option>
    <option value="12">12</option>
    <option value="13">13</option>
    <option value="14">14</option>
    <option value="15">15</option>
    <option value="16">16</option>
    <option value="17">17</option>
    <option value="18">18</option>
    <option value="19">19</option>
    <option value="20">20</option>
    <option value="21">21</option>
    <option value="22">22</option>
    <option value="23">23</option>
    <option value="24">24</option>
    <option value="25">25</option>
    <option value="26">26</option>
    <option value="27">27</option>
    <option value="28">28</option>
    <option value="29">29</option>
    <option value="30">30</option>
    <option value="31">31</option>
    </select>
    <select name="Year">
    <option value="2013">2013</option>
    <option value="2014">2014</option>
    </select></p>
    <p>Return date
    <select name="month">
    <option value="Jan">Jan</option>
    <option value="Feb">Feb</option>
    <option value="Mar">Mar</option>
    <option value="Apr">Apr</option>
    <option value="May">May</option>
    <option value="Jun">Jun</option>
    <option value="Jul">Jul</option>
    <option value="Aug">Aug</option>
    <option value="Sep">Sep</option>
    <option value="Oct">Oct</option>
    <option value="Nov">Nov</option>
    <option value="Dec">Dec</option>
    </select>
    <select name="Day">
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
    <option value="6">6</option>
    <option value="7">7</option>
    <option value="8">8</option>
    <option value="9">9</option>
    <option value="10">10</option>
    <option value="11">11</option>
    <option value="12">12</option>
    <option value="13">13</option>
    <option value="14">14</option>
    <option value="15">15</option>
    <option value="16">16</option>
    <option value="17">17</option>
    <option value="18">18</option>
    <option value="19">19</option>
    <option value="20">20</option>
    <option value="21">21</option>
    <option value="22">22</option>
    <option value="23">23</option>
    <option value="24">24</option>
    <option value="25">25</option>
    <option value="26">26</option>
    <option value="27">27</option>
    <option value="28">28</option>
    <option value="29">29</option>
    <option value="30">30</option>
    <option value="31">31</option>
    </select>
    <select name="Year">
    <option value="2013">2013</option>
    <option value="2014">2014</option>
    </select></p>
    <h3>Pick the type of car you want!</h3>
    <select name="Vechile Type">
    <option value="car">Car</option>
    <option value="truck">Truck</option>
    <option value="van">Van</option>
    <option value="toyota">Toyota</option>
    <option value="honda">Honda</option>
    <option value="chevy">Chevy</option>
    <option value="bmw">BMW</option>
    <option value="dodge">Dodge</option>
    </p>
    <input type="button" name="Submit Reservation" value="Submit Reservation" onclick="nextFrom()" />
    </form>
    </body>
    </html>
    Second Page

    Code:
    <!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=iso-8859-1" />
        <title>customerInfo</title>
    	<script type="text/javascript">
    	/* <![CDATA[ */
    		function previousForm() {
    		saveCustomerInfo();
    			location.href="CustomerInfo.html";
    		}
    		function nextForm() {
    		document.cookie = "name=" + encodeURIComponent(
    		document.forms[0].name.value);
    		document.cookie = "address1=" + encodeURIComponent(
    		document.forms[0].address1.value);
    		document.cookie = "address2=" + encodeURIComponent(
    		document.forms[0].address2.value);
    		document.cookie = "city=" + encodeURIComponent(
    		document.forms[0].city.value);
    		document.cookie = "state=" + encodeURIComponent(
    		document.forms[0].state.value);
    		document.cookie = "zip=" + encodeURIComponent(
    		document.forms[0].zip.value);
    		document.cookie = "telephone=" + encodeURIComponent(
    		document.forms[0].telephone.value);
    		document.cookie = "fax=" + encodeURIComponent(
    		document.forms[0].fax.value);
    		document.cookie = "pickup=" + encodeURIComponent(
    		document.forms[0].pickupDate.value);
    		document.cookie = "return=" + encodeURIComponent(
    		document.forms[0].returnDate.value);
    		document.cookie = "vechileType=" + encodeURIComponent(
    		document.forms[0].vechileType.value);
    		location.href = "customerInfo.html";
    		function populateCustomerInfo() {
    		if (document.cookie ) {
    		var queryData = decodeURIComponent(
    		document.cookie);
    		var queryArray = queryData.split("; ");
    		document.forms[0].name.value = queryArray[0]
    		.substring(queryArray[0]
    		.lastIndexOf("=") + 1);
    		document.forms[0].address1.value = queryArray[1]
    		.substring(queryArray[1]
    		.lastIndexOf("=") + 1);
    		document.forms[0].address2.value = queryArray[2]
    		.substring(queryArray[2]
    		.lastIndexOf("=") + 1);
    		document.forms[0].city.value = queryArray[3]
    		.substring(queryArray[3]
    		.lastIndexOf("=") + 1);
    		document.forms[0].state.value = queryArray[4]
    		.substring(queryArray[4]
    		.lastIndexOf("=") + 1);
    		document.forms[0].zip.value = queryArray[5]
    		.substring(queryArray[5]
    		.lastIndexOf("=") + 1);
    		document.forms[0].telephone.value = queryArray[6]
    		.substring(queryArray[6]
    		.lastIndexOf("=") + 1);
    		document.forms[0].fax.value = queryArray[7]
    		.substring(queryArray[7]
    		.lastIndexOf("=") + 1);
    		document.forms[0].pickup.value = queryArray[8]
    		.substring(queryArray[8]
    		.lastIndexOf("=") + 1);
    		document.forms[0].return.value = queryArray[9]
    		.substring(queryArray[9]
    		.lastIndexOf("=") + 1);
    		document.forms[0].vechileType.value = queryArray[10]
    		.substring(queryArray[10]
    		.lastIndexOf("=") + 1);
    		}
    		}
    		/* ]]> */
    	</script>
    </head>
    <body onload="populateNextForm()">
      <h2>Customer Information</h2>
      <form action="" method="get" enctype="application/x-www-form-urlencoded">
         <p class="txt_content_title">
          Name<br />
         <input type="text" name="name" size="60" /></p>
    	 <p class="txt_content_title">
         Address 1<br />
        <input type="text" name="address1" size="60" /></p>
     <p class="txt_content_title">
       Address 2<br />
     <input type="text" name="address2" size="60" /></p>
     <p class="txt_content_title">
       City, state, zip<br />
      <input type="text" name="city" size="38" />
      <input type="text" name="state" size="2" maxlength="2" />
      <input type="text" name="zip" size="10" maxlength="10" /></p>
       <p class="txt_content_title">
     Telephone<br />
      <input type="text" name="telephone" size="60" /></p>
      <p class="txt_content_title">
      Fax<br />
       <input type="text" name="fax" size="60" /></p>
       <p class="txt_content_title">
      Pickup Date<br />
     <input type="text" name="pickupDate" size="60" /></p>
     <p class="txt_content_title">
       Return Date<br />
       <input type="text" name="returnDate" size="60" /></p>
       <p class="txt_content_title">
       Vechile Type<br />
     <input type="text" name="vechileType" size="60" /></p>
       <p><input type="button" name="next" value=" Next " onclick="nextForm()" /></p>
       </form>
    </body>
    </html>

  2. #2
    Join Date
    May 2006
    Location
    Somewhere behind your screen
    Posts
    1,633
    first page(form1.htm)

    Code:
    <!DOCTYPE html>
    <html>
    <head>
    <title>CarRental</title>
    <meta http-equiv="content-type" content="text/html;charset=iso-8859-1" />
    <script type="text/javascript" src="script.js"></script>
    <script type="text/javascript">
    function doc(id){return document.getElementById(id);}
    window.onload=function(){
    doc('showInfo').onclick=function(){
    window.open('form2.htm','','width=450,height=550,top=10,left=500');
    }
    doc('submit_reservation').onclick=function(){
    saveFormData(this.form);
    return false;
    }
    }
    </script>
    </head>
    <body>
    <h1>Car Rental</h1>
    <h2>Reservations</h2>
    <form action="" method="get" enctype="application/x-www-form-urlencoded">
    <p><input type="button" name="showInfo" id="showInfo" value=" Show " /> an existing reservation or create a new one below.</p>
    <h2>Name and Address</h2>
    <p>First Name
    <input type="text" name="first_name" size="30" />
    Last Name
    <input type="text" name="last_name" size="30" />
    </p>
    <p>Street Address 1<input type="text" name="address_1" size="50" /></p>
    <p>Street Address 2<input type="text" name="address_2" size="50" /></p>
    <p>
    City<input type="text" name="city" size="25" />
    State <input type="text"name="state" size="5" maxlength="2" />
    Zip <input type="text" name="zip" size="15" maxlength="5" />
    </p>
    <p>
    Phone<input type="text" name="telephone" size="20" />
    Fax<input type="text" name="fax" size="20" />
    </p>
    <h2>Reservation Request</h2>
    <p>Pickup Date
    <select name="from_month">
    <option value="Jan">Jan</option>
    <option value="Feb">Feb</option>
    <option value="Mar">Mar</option>
    <option value="Apr">Apr</option>
    <option value="May">May</option>
    <option value="Jun">Jun</option>
    <option value="Jul">Jul</option>
    <option value="Aug">Aug</option>
    <option value="Sep">Sep</option>
    <option value="Oct">Oct</option>
    <option value="Nov">Nov</option>
    <option value="Dec">Dec</option>
    </select>
    <select name="from_day">
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
    <option value="6">6</option>
    <option value="7">7</option>
    <option value="8">8</option>
    <option value="9">9</option>
    <option value="10">10</option>
    <option value="11">11</option>
    <option value="12">12</option>
    <option value="13">13</option>
    <option value="14">14</option>
    <option value="15">15</option>
    <option value="16">16</option>
    <option value="17">17</option>
    <option value="18">18</option>
    <option value="19">19</option>
    <option value="20">20</option>
    <option value="21">21</option>
    <option value="22">22</option>
    <option value="23">23</option>
    <option value="24">24</option>
    <option value="25">25</option>
    <option value="26">26</option>
    <option value="27">27</option>
    <option value="28">28</option>
    <option value="29">29</option>
    <option value="30">30</option>
    <option value="31">31</option>
    </select>
    <select name="from_year">
    <option value="2013">2013</option>
    <option value="2014">2014</option>
    </select></p>
    <p>Return date
    <select name="to_month">
    <option value="Jan">Jan</option>
    <option value="Feb">Feb</option>
    <option value="Mar">Mar</option>
    <option value="Apr">Apr</option>
    <option value="May">May</option>
    <option value="Jun">Jun</option>
    <option value="Jul">Jul</option>
    <option value="Aug">Aug</option>
    <option value="Sep">Sep</option>
    <option value="Oct">Oct</option>
    <option value="Nov">Nov</option>
    <option value="Dec">Dec</option>
    </select>
    <select name="to_day">
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
    <option value="6">6</option>
    <option value="7">7</option>
    <option value="8">8</option>
    <option value="9">9</option>
    <option value="10">10</option>
    <option value="11">11</option>
    <option value="12">12</option>
    <option value="13">13</option>
    <option value="14">14</option>
    <option value="15">15</option>
    <option value="16">16</option>
    <option value="17">17</option>
    <option value="18">18</option>
    <option value="19">19</option>
    <option value="20">20</option>
    <option value="21">21</option>
    <option value="22">22</option>
    <option value="23">23</option>
    <option value="24">24</option>
    <option value="25">25</option>
    <option value="26">26</option>
    <option value="27">27</option>
    <option value="28">28</option>
    <option value="29">29</option>
    <option value="30">30</option>
    <option value="31">31</option>
    </select>
    <select name="to_year">
    <option value="2013">2013</option>
    <option value="2014">2014</option>
    </select></p>
    <h3>Pick the type of car you want!</h3>
    <select name="vechile_type">
    <option value="car">Car</option>
    <option value="truck">Truck</option>
    <option value="van">Van</option>
    <option value="toyota">Toyota</option>
    <option value="honda">Honda</option>
    <option value="chevy">Chevy</option>
    <option value="bmw">BMW</option>
    <option value="dodge">Dodge</option>
    </p>
    <input type="button" name="submit_reservation" id="submit_reservation" value="Submit Reservation" />
    </form>
    </body>
    </html>
    second page(form2.htm)

    Code:
    <!DOCTYPE html>
    <html>
    <head>
    <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
    <title>customerInfo</title>
    <script type="text/javascript" src="script.js"></script>
    <script type="text/javascript">window.onload=populateCustomerInfo;</script>
    </head>
    <body>
    <h2>Customer Information</h2>
    <form action="" method="get" enctype="application/x-www-form-urlencoded">
    <p class="txt_content_title">Name<br /><input type="text" name="name" size="60" /></p>
    <p class="txt_content_title">Address 1<br /><input type="text" name="address1" size="60" /></p>
    <p class="txt_content_title">Address 2<br /><input type="text" name="address2" size="60" /></p>
    <p class="txt_content_title">City, state, zip<br />
    <input type="text" name="city" size="38" />
    <input type="text" name="state" size="2" maxlength="2" />
    <input type="text" name="zip" size="10" maxlength="10" />
    </p>
    <p class="txt_content_title">Telephone<br /><input type="text" name="telephone" size="60" /></p>
    <p class="txt_content_title">Fax<br /><input type="text" name="fax" size="60" /></p>
    <p class="txt_content_title">Pickup Date<br /><input type="text" name="pickup_date" size="60" /></p>
    <p class="txt_content_title">Return Date<br /><input type="text" name="return_date" size="60" /></p>
    <p class="txt_content_title">Vechile Type<br /><input type="text" name="vechile_type" size="60" /></p>
    <p style="text-align:center"><input type="button" name="next" value=" close " onclick="window.close()" /></p>
    </form>
    </body>
    </html>
    javascript file(script.js)

    Code:
    function soGetCookie(cookieName,cookieExists){
    cookieName=''+escape(cookieName)+'=';
    if((cookiePos=document.cookie.indexOf(cookieName))!=-1){
    valuePos=cookiePos+cookieName.length;
    valueEnd=document.cookie.indexOf(';',valuePos);
    if(valueEnd==-1)valueEnd=document.cookie.length;
    return unescape(document.cookie.substring(valuePos,valueEnd));
    }
    return(typeof(cookieExists)=='undefined'?'':false);
    }
    
    function soSetCookie(cName,cValue,cStck){
    domain='';
    path= '/';
    expire='; expires='+(cStck ? new Date(new Date().getTime()+cStck).toGMTString():-1);
    document.cookie=''+escape(cName)+'='+escape(cValue)+'; path='+path+expire+domain+';';
    }
    
    function saveFormData(frm){
    var elems=frm.elements,str='';
    for(var i=0;i<elems.length;i++){
    if(elems[i].type=='button'){continue;}
    str+=elems[i].name+'='+elems[i].value+'; ';
    }
    /* 1000*seconds*minutes*hours because it must be in milliseconds */
    soSetCookie('car_rental',str,1000*60*60*24);
    frm.submit();
    }
    
    function getVal(arr,num,delim){
    var val=arr[num].substring(arr[num].lastIndexOf(delim)+1);
    return val || 'not specified';
    }
    
    function populateCustomerInfo(){
    if(document.cookie){
    var qdata=soGetCookie('car_rental'),
    qarr=qdata.split("; "),
    frm=document.forms[0];
    /*
    starts from index 0
    
    first_name=,
    last_name=,
    address_1=,
    address_2=,
    city=,
    state=,
    zip=,
    telephone=,
    fax=,
    from_month=Jan,
    from_day=1,
    from_year=2013,
    to_month=Jan,
    to_day=1,
    to_year=2013,
    vechile_type=car
    */
    
    frm.name.value=getVal(qarr,0,'=')+' '+getVal(qarr,1,'=');
    frm.address1.value=getVal(qarr,2,'=');
    frm.address2.value=getVal(qarr,3,'=');
    frm.city.value=getVal(qarr,4,'=');
    frm.state.value=getVal(qarr,5,'=');
    frm.zip.value=getVal(qarr,6,'=');
    frm.telephone.value=getVal(qarr,7,'=');
    frm.fax.value=getVal(qarr,8,'=');
    frm.pickup_date.value=getVal(qarr,9,'=')+','+getVal(qarr,10,'=')+','+getVal(qarr,11,'=');
    frm.return_date.value=getVal(qarr,12,'=')+','+getVal(qarr,13,'=')+','+getVal(qarr,14,'=');
    frm.vechile_type.value=getVal(qarr,15,'=');
    }
    }
    xxx: Guess Buddhist riddle: "What is the sound of one hand clapping?"
    yyy: facepalm

  3. #3
    Join Date
    Sep 2013
    Posts
    26
    Quote Originally Posted by Padonak View Post
    first page(form1.htm)

    Code:
    <!DOCTYPE html>
    <html>
    <head>
    <title>CarRental</title>
    <meta http-equiv="content-type" content="text/html;charset=iso-8859-1" />
    <script type="text/javascript" src="script.js"></script>
    <script type="text/javascript">
    function doc(id){return document.getElementById(id);}
    window.onload=function(){
    doc('showInfo').onclick=function(){
    window.open('form2.htm','','width=450,height=550,top=10,left=500');
    }
    doc('submit_reservation').onclick=function(){
    saveFormData(this.form);
    return false;
    }
    }
    </script>
    </head>
    <body>
    <h1>Car Rental</h1>
    <h2>Reservations</h2>
    <form action="" method="get" enctype="application/x-www-form-urlencoded">
    <p><input type="button" name="showInfo" id="showInfo" value=" Show " /> an existing reservation or create a new one below.</p>
    <h2>Name and Address</h2>
    <p>First Name
    <input type="text" name="first_name" size="30" />
    Last Name
    <input type="text" name="last_name" size="30" />
    </p>
    <p>Street Address 1<input type="text" name="address_1" size="50" /></p>
    <p>Street Address 2<input type="text" name="address_2" size="50" /></p>
    <p>
    City<input type="text" name="city" size="25" />
    State <input type="text"name="state" size="5" maxlength="2" />
    Zip <input type="text" name="zip" size="15" maxlength="5" />
    </p>
    <p>
    Phone<input type="text" name="telephone" size="20" />
    Fax<input type="text" name="fax" size="20" />
    </p>
    <h2>Reservation Request</h2>
    <p>Pickup Date
    <select name="from_month">
    <option value="Jan">Jan</option>
    <option value="Feb">Feb</option>
    <option value="Mar">Mar</option>
    <option value="Apr">Apr</option>
    <option value="May">May</option>
    <option value="Jun">Jun</option>
    <option value="Jul">Jul</option>
    <option value="Aug">Aug</option>
    <option value="Sep">Sep</option>
    <option value="Oct">Oct</option>
    <option value="Nov">Nov</option>
    <option value="Dec">Dec</option>
    </select>
    <select name="from_day">
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
    <option value="6">6</option>
    <option value="7">7</option>
    <option value="8">8</option>
    <option value="9">9</option>
    <option value="10">10</option>
    <option value="11">11</option>
    <option value="12">12</option>
    <option value="13">13</option>
    <option value="14">14</option>
    <option value="15">15</option>
    <option value="16">16</option>
    <option value="17">17</option>
    <option value="18">18</option>
    <option value="19">19</option>
    <option value="20">20</option>
    <option value="21">21</option>
    <option value="22">22</option>
    <option value="23">23</option>
    <option value="24">24</option>
    <option value="25">25</option>
    <option value="26">26</option>
    <option value="27">27</option>
    <option value="28">28</option>
    <option value="29">29</option>
    <option value="30">30</option>
    <option value="31">31</option>
    </select>
    <select name="from_year">
    <option value="2013">2013</option>
    <option value="2014">2014</option>
    </select></p>
    <p>Return date
    <select name="to_month">
    <option value="Jan">Jan</option>
    <option value="Feb">Feb</option>
    <option value="Mar">Mar</option>
    <option value="Apr">Apr</option>
    <option value="May">May</option>
    <option value="Jun">Jun</option>
    <option value="Jul">Jul</option>
    <option value="Aug">Aug</option>
    <option value="Sep">Sep</option>
    <option value="Oct">Oct</option>
    <option value="Nov">Nov</option>
    <option value="Dec">Dec</option>
    </select>
    <select name="to_day">
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
    <option value="6">6</option>
    <option value="7">7</option>
    <option value="8">8</option>
    <option value="9">9</option>
    <option value="10">10</option>
    <option value="11">11</option>
    <option value="12">12</option>
    <option value="13">13</option>
    <option value="14">14</option>
    <option value="15">15</option>
    <option value="16">16</option>
    <option value="17">17</option>
    <option value="18">18</option>
    <option value="19">19</option>
    <option value="20">20</option>
    <option value="21">21</option>
    <option value="22">22</option>
    <option value="23">23</option>
    <option value="24">24</option>
    <option value="25">25</option>
    <option value="26">26</option>
    <option value="27">27</option>
    <option value="28">28</option>
    <option value="29">29</option>
    <option value="30">30</option>
    <option value="31">31</option>
    </select>
    <select name="to_year">
    <option value="2013">2013</option>
    <option value="2014">2014</option>
    </select></p>
    <h3>Pick the type of car you want!</h3>
    <select name="vechile_type">
    <option value="car">Car</option>
    <option value="truck">Truck</option>
    <option value="van">Van</option>
    <option value="toyota">Toyota</option>
    <option value="honda">Honda</option>
    <option value="chevy">Chevy</option>
    <option value="bmw">BMW</option>
    <option value="dodge">Dodge</option>
    </p>
    <input type="button" name="submit_reservation" id="submit_reservation" value="Submit Reservation" />
    </form>
    </body>
    </html>
    second page(form2.htm)

    Code:
    <!DOCTYPE html>
    <html>
    <head>
    <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
    <title>customerInfo</title>
    <script type="text/javascript" src="script.js"></script>
    <script type="text/javascript">window.onload=populateCustomerInfo;</script>
    </head>
    <body>
    <h2>Customer Information</h2>
    <form action="" method="get" enctype="application/x-www-form-urlencoded">
    <p class="txt_content_title">Name<br /><input type="text" name="name" size="60" /></p>
    <p class="txt_content_title">Address 1<br /><input type="text" name="address1" size="60" /></p>
    <p class="txt_content_title">Address 2<br /><input type="text" name="address2" size="60" /></p>
    <p class="txt_content_title">City, state, zip<br />
    <input type="text" name="city" size="38" />
    <input type="text" name="state" size="2" maxlength="2" />
    <input type="text" name="zip" size="10" maxlength="10" />
    </p>
    <p class="txt_content_title">Telephone<br /><input type="text" name="telephone" size="60" /></p>
    <p class="txt_content_title">Fax<br /><input type="text" name="fax" size="60" /></p>
    <p class="txt_content_title">Pickup Date<br /><input type="text" name="pickup_date" size="60" /></p>
    <p class="txt_content_title">Return Date<br /><input type="text" name="return_date" size="60" /></p>
    <p class="txt_content_title">Vechile Type<br /><input type="text" name="vechile_type" size="60" /></p>
    <p style="text-align:center"><input type="button" name="next" value=" close " onclick="window.close()" /></p>
    </form>
    </body>
    </html>
    javascript file(script.js)

    Code:
    function soGetCookie(cookieName,cookieExists){
    cookieName=''+escape(cookieName)+'=';
    if((cookiePos=document.cookie.indexOf(cookieName))!=-1){
    valuePos=cookiePos+cookieName.length;
    valueEnd=document.cookie.indexOf(';',valuePos);
    if(valueEnd==-1)valueEnd=document.cookie.length;
    return unescape(document.cookie.substring(valuePos,valueEnd));
    }
    return(typeof(cookieExists)=='undefined'?'':false);
    }
    
    function soSetCookie(cName,cValue,cStck){
    domain='';
    path= '/';
    expire='; expires='+(cStck ? new Date(new Date().getTime()+cStck).toGMTString():-1);
    document.cookie=''+escape(cName)+'='+escape(cValue)+'; path='+path+expire+domain+';';
    }
    
    function saveFormData(frm){
    var elems=frm.elements,str='';
    for(var i=0;i<elems.length;i++){
    if(elems[i].type=='button'){continue;}
    str+=elems[i].name+'='+elems[i].value+'; ';
    }
    /* 1000*seconds*minutes*hours because it must be in milliseconds */
    soSetCookie('car_rental',str,1000*60*60*24);
    frm.submit();
    }
    
    function getVal(arr,num,delim){
    var val=arr[num].substring(arr[num].lastIndexOf(delim)+1);
    return val || 'not specified';
    }
    
    function populateCustomerInfo(){
    if(document.cookie){
    var qdata=soGetCookie('car_rental'),
    qarr=qdata.split("; "),
    frm=document.forms[0];
    /*
    starts from index 0
    
    first_name=,
    last_name=,
    address_1=,
    address_2=,
    city=,
    state=,
    zip=,
    telephone=,
    fax=,
    from_month=Jan,
    from_day=1,
    from_year=2013,
    to_month=Jan,
    to_day=1,
    to_year=2013,
    vechile_type=car
    */
    
    frm.name.value=getVal(qarr,0,'=')+' '+getVal(qarr,1,'=');
    frm.address1.value=getVal(qarr,2,'=');
    frm.address2.value=getVal(qarr,3,'=');
    frm.city.value=getVal(qarr,4,'=');
    frm.state.value=getVal(qarr,5,'=');
    frm.zip.value=getVal(qarr,6,'=');
    frm.telephone.value=getVal(qarr,7,'=');
    frm.fax.value=getVal(qarr,8,'=');
    frm.pickup_date.value=getVal(qarr,9,'=')+','+getVal(qarr,10,'=')+','+getVal(qarr,11,'=');
    frm.return_date.value=getVal(qarr,12,'=')+','+getVal(qarr,13,'=')+','+getVal(qarr,14,'=');
    frm.vechile_type.value=getVal(qarr,15,'=');
    }
    }
    I haven't tried it yet but thank you very much

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles