Jump to content
Angelo_Z

How keep selected value in dropdown

Recommended Posts

Hi ! Please . I need to keep selected value in dropdown after submit, How I ca do it? Thanks in advance.

  <form name="passa" id="passa" >

<select id="car" onchange="ChangeCarList()">
  <option value="">-- Car --</option>
  <option value="VO">Volvo</option>
  <option value="VW">Volkswagen</option>
  <option value="BMW">BMW</option>
</select>

<select id="carmodel"></select>

<script>
var carsAndModels = {};
carsAndModels['VO'] = ['V70', 'XC60', 'XC90'];
carsAndModels['VW'] = ['Golf', 'Polo', 'Scirocco', 'Touareg'];
carsAndModels['BMW'] = ['M6', 'X5', 'Z3'];

function ChangeCarList() {
  var carList = document.getElementById("car");
  var modelList = document.getElementById("carmodel");
  var selCar = carList.options[carList.selectedIndex].value;
  while (modelList.options.length) {
    modelList.remove(0);
  }
  var cars = carsAndModels[selCar];
  if (cars) {
    var i;
    for (i = 0; i < cars.length; i++) {
      var car = new Option(cars, i);
      modelList.options.add(car);
    }
  }
}
</script>

<input type="submit" name="azione"   id="azione"  value="Submit">
</form>

Share this post


Link to post
Share on other sites

 

Hi, nobody has replied, maybe I have not been clear about what I need.

for this input I have not problem, I resolve like this

<select id="car" onchange="ChangeCarList()">
  <option value="">-- Car --</option>
  <option value="VO"  <?php if($car == 'VO')  {echo 'selected="selected"';}?>>Volvo</option>
  <option value="VW"  <?php if($car == 'VW')  {echo 'selected="selected"';}?>>Volkswagen</option>
  <option value="BMW" <?php if($car == 'BMW') {echo 'selected="selected"';}?>>BMW</option>
</select>

 

but I don't Know what to do  for this input

<select id="carmodel"></select>

 

I wait your replies

Thanks

Share this post


Link to post
Share on other sites

Replies may be scarce because we don't understand the request.

Are you trying to parse the first selections into a second dropdown list?
Are you trying to save the 1st and 2nd selections to a local server using the PHP somehow?
Are you trying to retrieve the previous selections of a session on a session on a later day?

Count me confused.

 

Share this post


Link to post
Share on other sites

Thank you fot your reply,.

I am sorry for the confusion. Excuse by bad English.

Yes I  use PHP and I wish that the  previous selections  remines displayed on the form after pressed submit, I need to  show to the user which kind

 of 1st and 2nd selections he has done before, of course in te same session.

For the 1st selection it was easy to to this,  but for 2 nd I have not find a solution.

I hope to be more clear now.

Thank you very much.

 

Share this post


Link to post
Share on other sites

I know nothing about PHP, but since you say you have solved the 1st part of your question with it,
why not just go with it and create a 'grouped' drop-down selection list.  For example:

<!DOCTYPE html><html lang="en"><head><title> Test Page </title>
<meta charset="UTF-8">
<meta name="viewport" content="width-device-width,initial-scale=1.0, user-scalable=yes"/>
<!-- https://w3schools.invisionzone.com/topic/61714-how-keep-selected-value-in-dropdown/ -->
<!-- link rel="stylesheet" href="common.css" media="screen" -->
</head><body>

<form name="passa" id="passa" >

<select class=''>
 <option value="">Choose</option>
 <optgroup label="Volvo">
  <option value="V70"> V70 </option>
  <option value="XC60"> XC60 </option>
  <option value="XC90"> XC90 </option>
 </optgroup>
 <optgroup label="Volkswagen">
  <option value="Golf"> Golf </option>
  <option value="Polo"> Polo </option>
  <option value="Scirocco"> Scirocco </option>
  <option value="Touareg"> Touareg </option>
 </optgroup>
 <optgroup label="BMW">
  <option value="M6"> M6 </option>
  <option value="X5"> X5 </option>
  <option value="Z3"> Z3 </option>
 </optgroup>
</select>

<input type="submit" name="azione"   id="azione"  value="Submit">
</form> 

</body></html>

Easier to maintain than separate lists to match each car group.

Note: Not tested with your specific PHP code.

 

Share this post


Link to post
Share on other sites
<!DOCTYPE html> 
<head> 
	<title> 
		How to get selected value in 
		dropdown list using JavaScript? 
	</title> 
</head> 

<body> 
	<h1 style="color: green"> 
		GeeksForGeeks 
	</h1> 
	
	<b> 
		How to get selected value in 
		dropdown list using JavaScript? 
	</b> 
	
	<p> 
		Select one from the given options: 
		<select id="select1"> 
			<option value="free">Free</option> 
			<option value="basic">Basic</option> 
			<option value="premium">Premium</option> 
		</select> 
	</p> 
	
	<p> 
		The value of the option selected is: 
		<span class="output"></span> 
	</p> 
	
	<button onclick="getOption()"> 
		Check option 
	</button> 
	
	<script type="text/javascript">s 
		function getOption() { 
			selectElement = document.querySelector('#select1'); 
					
			output = 
			selectElement.options[selectElement.selectedIndex].value; 

			document.querySelector('.output').textContent = output; 
		} 
	</script> 
</body> 

</html>					 

 

Share this post


Link to post
Share on other sites

I presume you are using $_GET['car']; to set the value of $car?  because at the moment it won't work unless you use a name attribute

<select id="car" name="car" onchange="ChangeCarList()">

So will on submission get a quertstring in url of

WebPage.php?car=VW&azione=Submit, then will use 

$car = "";
if (isset($_GET['car'])) {
    $car = $_GET['car'];
}

to get value of "VW" so 'selected' can be applied.

If that is how it works, i suggest you do exactly the same for the second, you can use JavaScript to remove those options not related to a specific make afterwards, if you want! 

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...

×
×
  • Create New...