Solved

I want to keep user input in a drop down box after submit is pressed

Posted on 2011-09-15
11
247 Views
Last Modified: 2012-05-12
I have included 3 files: html form, css file, javascript file

When a user selects 'Spirits' from 'Alcohol Type' drop down box the form changes. When the user selects 'Calculate Duty' it defaults back to its original form.  I would the form to stay as is when the user selects an 'Alcohol Type'.  I've tried using onsubmit function but I can't get it to work they way I want.  
config.js
test.php
templatemo-style.css
0
Comment
Question by:dmalovich
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 6
  • 5
11 Comments
 
LVL 7

Expert Comment

by:cstsang
ID: 36547987
Replace the following statement:
<form id="theform"  name="duty" action="test.php"  enctype="multipart/form-data"  method="POST"> 

Open in new window

with
<form id="theform"  name="duty" action="test.php"  method="POST"> 

Open in new window

and try again
0
 

Author Comment

by:dmalovich
ID: 36548920
I did take out 'enctype="multipart/form-data"' but it still isn't working.  
0
 
LVL 7

Expert Comment

by:cstsang
ID: 36552665
yes,but you may notice that you can keep "Province/Territory" option.So, you can use the same implementation on keeping "Alcohol Type" option.
0
Salesforce Has Never Been Easier

Improve and reinforce salesforce training & adoption using WalkMe's digital adoption platform. Start saving on costly employee training by creating fast intuitive Walk-Thrus for Salesforce. Claim your Free Account Now

 

Author Comment

by:dmalovich
ID: 36557550
No, that doesn't work.  The selection stays after I submit, but the javascript code to change the form doesn't run.  That is my question.   Any ideas on how to do that?  
0
 
LVL 7

Expert Comment

by:cstsang
ID: 36558682
Which javascript code does not run?
the setOption function?
0
 
LVL 7

Expert Comment

by:cstsang
ID: 36558706
Do you mean the user select "Alcohol type", then click "calculate duty",
the selection can be keep, but the onchange function does not work?
0
 

Author Comment

by:dmalovich
ID: 36559905
Yes, thats right. onchange doesn't work when user submits form.
0
 
LVL 7

Expert Comment

by:cstsang
ID: 36561240
Which browser you are using? it works fine in IE and FF.
0
 

Author Comment

by:dmalovich
ID: 36561773
No, its not working in IE or FF.  When you select 'Spirits' for example, the form changes and you see 2 more fields.  When you submit the form those fields disappear.  I don't want them to disappear, I want them to stay as is.  
0
 
LVL 7

Accepted Solution

by:
cstsang earned 500 total points
ID: 36564415
In fact, that is php issue, not javascript, so I do 1 item for your reference.
It is concept problem, if you want to read the submitted value,
you need to do the job on server side.
<!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>test form</title>
<link href="css/templatemo_style.css" rel="stylesheet" type="text/css" />
<script src="config.js"></script>

<!--[if IE]>
<style type="text/css">
#theform #pt4 {
	padding: 2em 1em 1em 1em;
	}
</style>
<![endif]-->

</head>
<body>

<form id="theform"  name="duty" action="test.php"  method="posT"> 

	<fieldset id="pt1" class="error">
		<legend><span>Step </span> <span>: Login details</span></legend>
		<h3>Step 1: Select Province or Territory,Alcohol Type, and input Total Cost.</h3>
		<div class="help"></div>
		<label for="loginname">Province/Territory</label>
        <select style="width:175px;" name="province"  onchange="">
		<?php
			IF (!isset($_POST['province'])) {
			   echo ("<option value=\"default\" SELECTED>-- Select --</option>");
			} 
			IF ($_POST['province']=="Alberta") {
			   echo ("<option value=\"Alberta\" SELECTED>Alberta</option>");
			} else {
				echo ("<option value=\"Alberta\" >Alberta</option>");
			}
			IF ($_POST['province']=="British Columbia") {
			   echo ("<option value=\"British Columbia\" SELECTED>British Columbia</option>");
			} else {
				echo ("<option value=\"British Columbia\" >British Columbia</option>");
			}
			IF ($_POST['province']=="Manitoba") {
			   echo ("<option value=\"Manitoba\" SELECTED>Manitoba</option>");
			} else {
				echo ("<option value=\"Manitoba\" >Manitoba</option>");
			}
			IF ($_POST['province']=="New Brunswick") {
			   echo ("<option value=\"New Brunswick\" SELECTED>New Brunswick</option>");
			} else {
				echo ("<option value=\"New Brunswick\" >New Brunswick</option>");
			}
			IF ($_POST['province']=="Newfoundland") {
			   echo ("<option value=\"Newfoundland\" SELECTED>Newfoundland</option>");
			} else {
				echo ("<option value=\"Newfoundland\" >Newfoundland</option>");
			}
			IF ($_POST['province']=="Nova Scotia") {
			   echo ("<option value=\"Nova Scotia\" SELECTED>Nova Scotia</option>");
			} else {
				echo ("<option value=\"Nova Scotia\" >Nova Scotia</option>");
			}
			IF ($_POST['province']=="Ontario") {
			   echo ("<option value=\"Ontario\" SELECTED>Ontario</option>");
			} else {
				echo ("<option value=\"Ontario\" >Ontario</option>");
			}
			IF ($_POST['province']=="P.E.I.") {
			   echo ("<option value=\"P.E.I.\" SELECTED>P.E.I.</option>");
			} else {
				echo ("<option value=\"P.E.I.\" >P.E.I.</option>");
			}
			IF ($_POST['province']=="Quebec") {
			   echo ("<option value=\"Quebec\" SELECTED>Quebec</option>");
			} else {
				echo ("<option value=\"Quebec\" >Quebec</option>");
			}
			IF ($_POST['province']=="Saskatchewan") {
			   echo ("<option value=\"Saskatchewan\" SELECTED>Saskatchewan</option>");
			} else {
				echo ("<option value=\"Saskatchewan\" >Saskatchewan</option>");
			}			
			IF ($_POST['province']=="Yukon") {
			   echo ("<option value=\"Yukon\" SELECTED>Yukon</option>");
			} else {
				echo ("<option value=\"Yukon\" >Yukon</option>");
			}		
			IF ($_POST['province']=="N.W.T.") {
			   echo ("<option value=\"N.W.T.\" SELECTED>N.W.T.</option>");
			} else {
				echo ("<option value=\"N.W.T.\" >N.W.T.</option>");
			}
			IF ($_POST['province']=="Nunavut") {
			   echo ("<option value=\"Nunavut\" SELECTED>Nunavut</option>");
			} else {
				echo ("<option value=\"Nunavut\" >Nunavut</option>");
			}
		?>      
		</select><br /><br />
		
        <label for="loginname">Alcohol Type</label>                                 
        <select style="width:175px;" name="alcohol_type" 
        onchange="setOptions(document.duty.alcohol_type.options[document.duty.alcohol_type.selectedIndex].value)";>
		<option value="">-- Select --</option>
			<option value="1">Spirits</option>
            <option value="2">Spirit Coolers</option>
            <option value="3">Wine</option>
            <option value="4">Wine Coolers</option>
            <option value="5">Sparkling Wine</option>
            <option value="6">Cider</option>
            <option value="7">Beer</option>    
        </select><br /><br />
		
		<label for="password1">Total Cost ($CDN)</label>
        <input style="width:170px;" type="text" name="cost" value="Enter Total Cost ($CDN)" onfocus="value=''" />
	</fieldset>
	
	<fieldset id="pt2" class="error">
		<legend><span>Step </span> <span>: Password</span></legend>
		<h3>Step 2: Select Quantity,enter Alcohol %, and any other fields that may appear.</h3>
		<div class="help"></div>
		
        <label for="password1">Quantity</label>        
        <select style="width:175px;" id="typeSpirits" name="quantity" size="1">
            <option value=" " selected="selected">-- Select --</option>
        </select><br /><br />
		
        <label for="password1">Alcohol %</label>
        <input style="width:170px;" type="text" name="percentage" value="Enter Alcohol Percentage" onfocus="value=''" /><br /><br />
		<div style="display:none" id="spiritType">
		<label for="password1">Spirits Type</label>	
		<select style="width:150px;" name="spirits_type">
            <option value="">-- Select --</option>
            <option value="Whisky">Whisky</option>
            <option value="Rum">Rum</option>
            <option value="Vodka">Vodka</option>
            <option value="Tequila">Tequila</option>
            <option value="Gin">Gin</option>
            <option value="Liqueurs">Liqueurs</option>
            <option value="Brandy/Cognac">Brandy/Cognac</option>
            <option value="Other">Other</option>
        </select><br /><br />
        </div> 
       
		<?php
		  $xx=$_POST['outside_country']; 
		  if (strlen($xx)==0)	
			echo ("<div style=\"display:none\" id=\"outsideText\">");	
		  else                        
		    echo ("<div id=\"outsideText\">");
		 ?> 
		<label for="outside_country">Made Outside N.A.,Mexico?</label>	 
        <select name="outside_country">
		    <option value="">-- Select --</option>
            <option value="No" <?php if ($xx=="No"){ echo ("selected");}?>>No</option>
            <option value="Yes"  <?php if ($xx=="Yes"){ echo ("selected");}?>>Yes</option>
        </select><br /><br />
		</div>
		
		<div style="display:none" id="bottledIn">
		<label for="bottled_in">Country Of Origin</label>	 
		<select style="width:175px;"  name="bottled_in">
			<option value="">Bottled In?</option>
			<option value="Canada">Canada</option>
			<option value="United States">United States</option>
			<option value="Mexico">Mexico</option>
			<option value="United Kingdom">United Kingdom</option>
			<option value="Australia">Australia</option>
			<option value="New Zealand">New Zealand</option>
			<option value="South Africa">South Africa</option>
			<option value="France">France</option>
			<option value="Other">Other</option>
        </select> 
		</div>
		
	</fieldset>
	
	<fieldset id="pt4">
		<legend></legend>
		<h3></h3>
		<div id="disclaimer">	
		<input type="submit" id="submitform" tabindex="6"  value="Calculate Duty" /></div>
	</fieldset>
	<div id="copyright">2011 - Duty calculations are complex. Every effort has been made towards their
						accuracy but, they cannot be 100% guaranteed. CSS by Design Shack</div>
</form>

</body>

</html>

Open in new window

0
 

Author Closing Comment

by:dmalovich
ID: 36567300
Thank you so much.  Doing it in php worked......
0

Featured Post

[Webinar] Learn How Hackers Steal Your Credentials

Do You Know How Hackers Steal Your Credentials? Join us and Skyport Systems to learn how hackers steal your credentials and why Active Directory must be secure to stop them. Thursday, July 13, 2017 10:00 A.M. PDT

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

In my daily work (mainly using ASP.net), I need to write a lot of JavaScript code. One of the most repetitive tasks I do are the jQuery Ajax calls. You know: (CODE) I don't know if for you it's the same, but for me is soooo tedious to write the …
Article by: DanRollins
This article describes a JavaScript program that creates a maze made of hexagonal cells.  In Part 2 (http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/A_7850-Hex-Maze-Part-2.html), we'll extend the program by adding a depth-…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

728 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question