DWR 的一个常遇到的任务就是根据选项填充选择列表。下面的例子就是根据输入填充列表。
下面将介绍 DWRUtil.addOptions() 的几种是用方法。
如果你希望在你更新了 select 以后,它仍然保持运来的选择,你要像下面这样做:
var sel = DWRUtil.getValue(id);
DWRUtil.removeAllOptions(id);
DWRUtil.addOptions(id, ...);
DWRUtil.setValue(id, sel);
如果你想加入一个初始的"Please select…" 选项那么你可以直接加入下面的语句:
DWRUtil.addOptions(id, \["Please select ..."]);
DWRUtil.addOptions 有 5 种模式:
- 数组: DWRUtil.addOptions(selectid, array) 会创建一堆 option,每个 option 的文字和值都是数
组元素中的值。 - 对象数组 (指定 text): DWRUtil.addOptions(selectid, data, prop) 用每个数组元素创造一个
option,option 的值和文字都是在 prop 中指定的对象的属性。 - 对象数组 (指定 text 和 value 值): DWRUtil.addOptions(selectid, array, valueprop, textprop) 用
每个数组元素创造一个 option,option 的值是对象的 valueprop 属性,option 的文字是对象的
textprop 属性。 - 对象: DWRUtil.addOptions(selectid, map, reverse)用每个属性创建一个 option。对象属性名用
来作为 option 的值,对象属性值用来作为属性的文字,这听上去有些不对。但是事实上却是正
确的方式。如果 reverse 参数被设置为 true,那么对象属性值用来作为选项的值。 - 对象的 Map: DWRUtil.addOptions(selectid, map, valueprop, textprop) 用 map 中的每一个对象
创建一个 option。用对象的 valueprop 属性做为 option 的 value,用对象的 textprop 属性做为
option 的文字。 - ol 或 ul 列表: DWRUtil.addOptions(ulid, array) 用数组中的元素创建一堆 li 元素,他们的
innerHTML 是数组元素中的值。这种模式可以用来创建 ul 和 ol 列表。