[英]Populate HTML5 dropdown values with JSON data
I have US states JSON data as below 我有美国各州的JSON数据,如下所示
{"States":["Alaska","Alabama","Arkansas","American Samoa","Arizona","California","Colorado","Connecticut","District of Columbia","Delaware","Florida","Federated States of Micronesia","Georgia","Guam","Hawaii","Iowa","Idaho","Illinois","Indiana","Kansas","Kentucky","Louisiana","Massachusetts","Maryland","Maine","Marshall Islands","Michigan","Minnesota","Missouri","Northern Marianas","Mississippi","Montana","North Carolina","North Dakota","Nebraska","New Hampshire","New Jersey","New Mexico","Nevada","New York","Ohio","Oklahoma","Oregon","Pennsylvania","Puerto Rico","Palau","Rhode Island","South Carolina","South Dakota","Tennessee","Texas","Utah","Virginia","Virgin Islands","Vermont","Washington","Wisconsin","West Virginia","Wyoming","Armed Forces Europe, the Middle East, and Canada","Armed Forces Pacific","Armed Forces Americas"]}
Now in my web app I deserialize JSON and bind to HTML5 dropdown to get following 现在在我的网络应用中,我反序列化JSON并绑定到HTML5下拉列表以获取关注
What I am trying to get to is that; 我要达到的目标是: How can I modify JSON data so that when I bind to dropdown, Value is state code and text is full state name so some thing like this
如何修改JSON数据,以便当我绑定到下拉列表时,Value是状态代码,文本是完整的状态名称,所以像这样
<option value="IL">Illinois</option>
Please note there is options
and optionsText
in the data-bind
attribute for a <select>
element. 请注意,
<select>
元素的data-bind
属性中包含options
和optionsText
。
If you json is: 如果您的json是:
States:[
{ name:'Illinois', value:'IL'},
{ name:..., value:...},
....
]
<select data-bind="
options: value, // IL, ...
optionsText: name, // Illinois, ...
value: lead().state,
optionsCaption: 'Choose state...'">
</select>
Only minor change I had to make from Blaise's reply was as below 我仅需对Blaise的回复进行细微改动,如下所示
<select data-bind="
options: states,
optionsValue: 'value'// IL, ...
optionsText: 'name', // Illinois, ...
value: lead().state,
optionsCaption: 'Choose state...'">
</select>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.