Save DropDown selection with HTML5 storage?

[kashmirs22]

hey everyone,

I have;

<form method="post" action="search.php">
<select name="country" class="dropdownselect" >

<option value="">Select Country</option>

<option value="Afghanistan" selected="selected">Afghanistan</option>
<option value="Albania" selected="selected">Albania</option>
<option value="Algeria" selected="selected">Algeria</option>
<option value="American Samoa" selected="selected">American Samoa</option>
</select>

</form>

And then Im doing SQL query to display results from database.


I need to somehow leave selected option selected after someones preform search and pages refresh.

Im planing to use HTML5 storage, something like this;

<script>

localStorage.setItem('country', $('select[name=country]').val());
localStorage.getItem('country');

</script>

But I dont know how to display it correctly,


Can someone help?



Thanks in advance!


Josip

[rtrethewey]

Setting the 'selected' attribute on all of the <option> tags in a <select> list is invalid, so be sure to remove those attributes before you do anything else.

I think a better method would be to have the PHP script that generates this page set the 'selected' attribute if it's executing a user search (as opposed to displaying the page for the first time). This avoids the HTML5 incompatibility issues with older browsers and avoids issues with users running with cookies disabled or blocked (which is also a good alternative).

So somewhere near the top of your PHP code, you'd have:

 $countrySelected = '';
 if (isset($_POST['country'])) { $countrySelected = $_POST['country']; }
 ?>

and then later when you're displaying the search form's <select> list of country <options>:

<select name="country" size="1">
<?php
.
.
 echo("<option value=\"$countryName\"");
  if ($countryName == $countrySelected) { echo(" selected=\"selected\"); }
 echo(">$countryName</option>");
.
.
?>

[NickJohnson]

I was also facing the same problem... thanx for putting this prob here & taking out the solution........