AnchovyLegend
AnchovyLegend

Reputation: 12538

Optimal way to auto select option from select drop down after submit

The problem I am running into is, when the form is submitted, the user's dropdown selections are lost and I would like the dropdown menu selections to be auto selected on load, after submit (form posts to the same page as it is submitted from), based on the users drop down selections.

I was wondering what is the simplest way to use the posted $_POST values, from <select> elements to auto select the corresponding options from the select drop downs.

This is what I tried, with no success:

<select name="filter1" value="<?php echo isset($_POST['filter1']) ? $_POST['filter1'] : ""; ?>">
    <?php echo getFilterOptions(); ?>
</select>

Note: I'm looking for the easiest way to do this. I am open to using JQuery, JavaScript, or PHP for the solution. If possible, I would like to not hard code anything into the options, because those are auto generated using mySQL / PHP.

Upvotes: 1

Views: 11058

Answers (6)

adeneo
adeneo

Reputation: 318212

You can do it like this :

<select name="filter1">
    <option value="test1">test 1</option>
    <option value="test2">test 2</option>
</select>

<script>
    document.getElementsByName('filter1')[0].value = '<?php echo $_POST['filter1']; ?>'
</script>

Upvotes: 2

mediaeventi
mediaeventi

Reputation: 21

Select input values are set this way:

<select name="filter1">
  <option value="red">Red</option>
  <option value="green" selected="selected">Green</option>
  <option value="blue">Blue</option>
</select>

with the Green option selected.

In your getFilterOptions function you should loop through your options and for each option compare to post value of field name filter1:

<select name="filter1">
<?php echo getFilterOptions("filter1"); ?>
</select>

<?php 
function getFilterOptions($fieldName) {

  $options = array("red" => "Red", "green" => "Green", "blue" => "Blue"); // Assuming these are your database extracted options
  $select = "";
  $isSetField = isset($_POST[$fieldName]) ? true : false;


  foreach($options AS $value => $name) {
    $select .= '<option value="' . $value . '" ' . ($isSetField && $value == $_POST[$fieldName] ? 'selected="selected"' : '') . '>' . $name . '</option>';
  }
  return $select;
}
?>

Upvotes: 2

Milan
Milan

Reputation: 3335

$isSelected = "";
$value = $_POST['filter1'];

...so you need to generate the drop down something like this:

echo "<select id='drop-down' name='filter1'>";

for($i=0; $i<=count($dropDownValues); $i++) {

     if ($value==$i) $isSelected="selected='selected'";

     echo "<option value='$i' $isSelected >$i</option>";

}

... I did not test this but it should work. Obviously this is missing all the $_POST validation bells&whistles etc...

Upvotes: 0

shat
shat

Reputation: 212

Loop through the values and select=selected on the value stored in _POST:

<?php
$dropdownFilter1= array("Dog","Cat","Fox");
echo "<select>";
foreach($dropdownFilter1 as $selectOption){
  $select = ($selectOption == $_POST['filter1'])? "selected='selected'":"";
  echo "<option $select>$selectOption</option>";
}
echo "</select>";

Just thinking out loud.

Upvotes: 0

Try

set id in html of select and use

JavaScript to select value in drop-down-list

<script>
function setSelectedValue(selectObj, valueToSet) {
    for (var i = 0; i < selectObj.options.length; i++) {
        if (selectObj.options[i].value == valueToSet) {
            selectObj.options[i].selected = true;
            return;
        }
    }
}
var objSelect1 = document.getElementById('filter1');
setSelectedValue(objSelect1, "<?php $_POST['filter1']; ?>");
</script>

Usage

setSelectedValue(objSelect1,Value);

Upvotes: 0

cbrues
cbrues

Reputation: 1

You have to include the selected="selected" attribute on the option that is to be selected. Passing $_POST['filter1'] to getFilterOptions and checking it against the current option you are outputting would be my suggestion.

Upvotes: 0

Related Questions