I have a weird html option list which I dont want to check each value to make it selected or not see the list below
<select name="height" id="height">
<option value="" label="Select">Select Height</option>
<option value="4ft 5in - 134cm" label="4ft 5in - 134cm">4ft 5in - 134cm</option>
<option value="4ft 6in - 137cm" label="4ft 6in - 137cm">4ft 6in - 137cm</option>
<option value="4ft 7in - 139cm" label="4ft 7in - 139cm">4ft 7in - 139cm</option>
<option value="4ft 8in - 142cm" label="4ft 8in - 142cm">4ft 8in - 142cm</option>
<option value="4ft 9in - 144cm" label="4ft 9in - 144cm">4ft 9in - 144cm</option>
<option value="4ft 10in - 147cm" label="4ft 10in - 147cm">4ft 10in - 147cm</option>
<option value="4ft 11in - 149cm" label="4ft 11in - 149cm">4ft 11in - 149cm</option>
<option value="5ft - 152cm" label="5ft - 152cm">5ft - 152cm</option>
<option value="5ft 1in - 154cm" label="5ft 1in - 154cm">5ft 1in - 154cm</option>
<option value="5ft 2in - 157cm" label="5ft 2in - 157cm">5ft 2in - 157cm</option>
<option value="5ft 3in - 160cm" label="5ft 3in - 160cm">5ft 3in - 160cm</option>
<option value="5ft 4in - 162cm" label="5ft 4in - 162cm">5ft 4in - 162cm</option>
<option value="5ft 5in - 165cm" label="5ft 5in - 165cm">5ft 5in - 165cm</option>
<option value="5ft 6in - 167cm" label="5ft 6in - 167cm">5ft 6in - 167cm</option>
<option value="5ft 7in - 170cm" label="5ft 7in - 170cm">5ft 7in - 170cm</option>
<option value="5ft 8in - 172cm" label="5ft 8in - 172cm">5ft 8in - 172cm</option>
<option value="5ft 9in - 175cm" label="5ft 9in - 175cm">5ft 9in - 175cm</option>
<option value="5ft 10in - 177cm" label="5ft 10in - 177cm">5ft 10in - 177cm</option>
<option value="5ft 11in - 180cm" label="5ft 11in - 180cm">5ft 11in - 180cm</option>
<option value="6ft - 182cm" label="6ft - 182cm">6ft - 182cm</option>
<option value="6ft 1in - 185cm" label="6ft 1in - 185cm">6ft 1in - 185cm</option>
<option value="6ft 2in - 187cm" label="6ft 2in - 187cm">6ft 2in - 187cm</option>
<option value="6ft 3in - 190cm" label="6ft 3in - 190cm">6ft 3in - 190cm</option>
<option value="6ft 4in - 193cm" label="6ft 4in - 193cm">6ft 4in - 193cm</option>
<option value="6ft 5in - 195cm" label="6ft 5in - 195cm">6ft 5in - 195cm</option>
<option value="6ft 6in - 198cm" label="6ft 6in - 198cm">6ft 6in - 198cm</option>
<option value="6ft 7in - 200cm" label="6ft 7in - 200cm">6ft 7in - 200cm</option>
<option value="6ft 8in - 203cm" label="6ft 8in - 203cm">6ft 8in - 203cm</option>
<option value="6ft 9in - 205cm" label="6ft 9in - 205cm">6ft 9in - 205cm</option>
<option value="6ft 10in - 208cm" label="6ft 10in - 208cm">6ft 10in - 208cm</option>
<option value="6ft 11in - 210cm" label="6ft 11in - 210cm">6ft 11in - 210cm</option>
<option value="7ft - 213cm" label="7ft - 213cm">7ft - 213cm</option>
</select>
I need to make a particluar value to be set selected, whhen form is sbumitted, I know the value of select, But i dont want to match against each option value to make it selected
SO what I am looking for is there anyway (not jquery) to make a value selected from tag itself without using selected option in tag
I tried to set value="some value" in select but it didnt work !
No.
Multiple options can have the same value and (if the multiple
attribute is set) multiple options can be selected at the same time, so having an attribute to specify the value wouldn't be feasible.
You can't change the <select>
element to specify this: it's not part of the HTML specification. What you can do is give each option
element an id
and then use Javascript to set the right option
element(s) as selected
. In PHP, you would need to output the script snippet in the right place to get the browser to run it.
For example
<option value="7ft - 213cm" label="7ft - 213cm" id="s23">7ft - 213cm</option>
...
<script>
document.getElementById("s23").selected=true
</script>
You could always just write a helper function that gives you the <option>
by passing it parameters. Something along the lines of
function get_option($value, $selected_value) {
return '<option value="' . $value . '" label="' . $value . '"' . ($value == $selected_value ? ' selected="selected"' : '') . '>' . $value . "</option>
";
}
This will keep you from having to write it for each value, but instead just do
$selected_value = '4ft 5in - 134cm';
echo get_option('4ft 5in - 134cm', $selected_value);
echo get_option('4ft 6in - 137cm', $selected_value);
//etc, etc
You can put all items in an array and dynamically generate the list with a for (or foreach) loop. Then just check in this loop whether your loopvariable equals your value and if so, assign the selected attribute.
Something like this:
<select name="height" id="height">
<option value="" label="Select">Select Height</option>
<?php
$options = array("4ft 5in - 134cm", "4ft 6in - 137cm", "4ft 7in - 139cm", /* and all your other options ... */);
$yourvalue = "4ft 6in - 137cm"; // or any valid entry
foreach($options as $option) {
echo '<option value="'.$option.'" label="'.$option.'" '. ($option == $yourvalue ? 'selected' : '') .'>'.$option.'</option>';
}
?>
</select>
If you don't want to use javascript, you're going to have to write the code you're avoiding.
<? $selected = "6ft 10in - 208cm"; ?>
<select name="height" id="height">
<option value="" label="Select">Select Height</option>
<? foreach ( $options as $option ): ?>
<option value="<?= $option; ?>" <?= ($option == $selected ? "selected" : ""); ?> ><?= $option; ?></option>
<? endforeach; ?>
</select>