[英]Make select option value case insensitive / have multiple values
My form gets prepopulated onload with values from querystring. 我的表单使用查询字符串中的值获取预先填充的onload。 In the query, when country=Australia, "Australia" gets selected.
在查询中,当country = Australia时,“Australia”被选中。 But when country=AUSTRALIA or country=australia, nothing gets selected.
但是当country = AUSTRALIA或country = australia时,什么都没有被选中。
My select field: 我的选择字段:
<select id="country" name="country" style="border: 1px solid rgb(204, 204, 204); font-family: Arial,Helvetica,sans-serif; font-size: 9pt; width: 150px;">
<option value="" selected="selected">Please select country</option>
<option value="Australia">Australia</option>
<option value="Austria">Austria</option>
</select>
I guess <option value="Australia, AUSTRALIA, australia">
would make it work. 我猜
<option value="Australia, AUSTRALIA, australia">
会让它发挥作用。 How do I get this done? 我怎么做到这一点? Would this ( Can an Option in a Select tag carry multiple values? ) be an option?
这个( Select标签中的选项可以带有多个值? )是一个选项吗?
Otherwise, how could I make the select field case insensitive for pre-population with querystring values? 否则,如何使用查询字符串值使选择字段不区分大小写?
JS for querystring added: JS for querystring添加:
function populate(form) {
if (location.search == null || location.search.length < 1) return; // no querystring
var pairs = location.search.substring(1).split("+");
for (var p = 0; p < pairs.length; ++p) {
var pair = pairs[p].split("=");
var name = pair[0];
var value = unescape(pair[1].replace(/\+/g, " "));
var fld = form.elements[name];
var ftype = null;
var farray = false;
var atype = Array;
if (fld != null) {
if (fld.length != null && fld.length >= 1 && fld[0].type != null && fld[0].type != undefined) {
ftype = fld[0].type;
farray = true;
} else {
ftype = fld.type;
}
}
switch (ftype) {
case "text":
case "hidden":
case "textarea":
if (farray) fld = fld[0]; // only handle first-named for this type
fld.value = value;
break;
case "select-one":
case "select-multiple":
if (farray) fld = fld[0]; // only handle first-named for this type
for (var o = 0; o < fld.options.length; ++o) {
var opt = fld.options[o];
var oval = opt.value;
if (oval == null || oval == "") oval = opt.text;
if (oval == value) {
opt.selected = true;
break;
}
}
break;
case "checkbox":
case "radio":
if (!farray) {
// single checbox or radio of that name:
fld.checked = true;
} else {
for (var cr = 0; cr < fld.length; ++cr) {
if (fld[cr].value == value) {
fld[cr].checked = true;
break;
}
}
}
break;
default:
alert("Unknown field type encountered for field " + name + ": " + ftype);
break;
} // end of switch
} // end of loop on fields from qs
}
When you're prepopulating (I'm guessing you compare values in a for
loop), compare values with .toLowerCase()
. 当你预先填充时(我猜你在
for
循环中比较值),用.toLowerCase()
比较值。 For example: 例如:
if (querystringValue.toLowerCase() === optionValue.toLowerCase()) {
// Select this option
break;
}
UPDATE: 更新:
For your updated code, I think it would be here: 对于您更新的代码,我认为它会在这里:
if (oval == value) {
opt.selected = true;
break;
}
So change it to: 所以改成它:
if (oval.toLowerCase() === value.toLowerCase()) {
opt.selected = true;
break;
}
Depending on if this applies, you might want to do the same to your checkbox/radio button setting: 根据是否适用,您可能希望对复选框/单选按钮设置执行相同操作:
if (fld[cr].value == value) {
But that's really up to you. 但那真的取决于你。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.