提交后从选择下拉列表中自动选择选项的最佳方法
Optimal way to auto select option from select drop down after submit
我遇到的问题是,提交表单时,用户的下拉选择会丢失,我希望在加载时自动选择下拉菜单选择,提交后(表单发布到提交时来自的同一页面),基于用户的下拉选择。
我想知道使用已发布的$_POST
值的最简单方法是什么,从<select>
元素到从选择下拉列表中自动选择相应的选项。
这是我尝试过的,但没有成功:
<select name="filter1" value="<?php echo isset($_POST['filter1']) ? $_POST['filter1'] : ""; ?>">
<?php echo getFilterOptions(); ?>
</select>
注意:我正在寻找最简单的方法。我愿意使用JQuery,JavaScript或PHP作为解决方案。如果可能的话,我不想在选项中硬编码任何内容,因为这些选项是使用 mySQL/PHP 自动生成的。
你可以这样做:
<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>
选择输入值按以下方式设置:
<select name="filter1">
<option value="red">Red</option>
<option value="green" selected="selected">Green</option>
<option value="blue">Blue</option>
</select>
,然后选择绿色选项。
在getFilterOptions函数中,您应该遍历您的选项,并将每个选项与字段名称filter1的post值进行比较:
<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;
}
?>
您必须在要选择的选项中包含 selected="selected"
属性。我的建议是将$_POST['filter1']
传递给getFilterOptions
并根据您输出的当前选项进行检查。
尝试
在选择和使用 HTML 中设置 ID
JavaScript 在下拉列表中选择值
<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>
用法
setSelectedValue(objSelect1,Value);
遍历值并选择=选择存储在_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>";
只是大声思考。
$isSelected = "";
$value = $_POST['filter1'];
。所以你需要生成这样的下拉菜单:
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>";
}
。我没有测试这个,但它应该可以工作。显然,这缺少所有 _POST 美元的验证花里胡哨等......
相关文章:
- CKeditor:更改对话框中的默认选择选项
- 如何在从多选下拉列表中选择选项值时动态生成文本框
- AngularJs列表ng单击以选择选项转换
- 使用基于文本的 Jquery 选择选项
- 当选择值x时,Javascript需要在正确的位置显示文本区域,从而循环通过具有选择选项的表单
- 在php和mysql中选择选项.一旦选择了选项,就列出我的sql数据库数据
- 选择选项时如何显示警报
- 使用php动态更改选择选项
- 选择“选择选项”时显示文本.怎么做
- LEAFLET地图和带有选择选项的标记-ANGULARjs
- 使用js将动态内容添加到选择选项列表中
- 用于使用javascript循环选择选项
- AngularJS-选择选项并在函数中使用它
- 禁用/启用基于单选/选择选项所选Javascript的文本框
- 如何使用jQuery隐藏与选择选项相关的选择选项列表
- 选择选项是添加或删除事件
- 使用jQuery向“选择选项”添加默认属性
- 构建HTML选择字段并使用JavaScript数组选择选项
- 带有动态选择选项的Firefox html5验证异常
- 只有当Angular从资源对象检索数据时,才选择选项元素