var app = {
selections: {
things: [
{ Name: "name1", Value: "thingValue1" },
{ Name: "name2", Value: "thingValue2" },
{ Name: "name3", Value: "thingValue3" }
],
places: [
{ Name: "place1", Value: "placeValue1" },
{ Name: "place2", Value: "placeValue2" },
{ Name: "place3", Value: "placeValue3" }
]
},
formData: {
selectedThing: "thingValue1",
selectedPlace: "placeValue1"
}
};
var template = $.templates("#theTmpl");
template.link("#content", app);<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script src="http://www.jsviews.com/download/jsviews.js"></script>
<div id="content"></div>
<script id="theTmpl" type="text/x-jsrender">
<select id="thingChoice" data-link="formData.selectedThing">
<option value="-">Please select</option>
{^{for selections.things}}
<option data-link="{value{:Value} text{:Name}} selected{:formData.selectedThing}}"></option>
{{/for}}
</select>
<select id="placeChoice" data-link="formData.selectedPlace">
<option value="-">Please select</option>
{^{for selections.places}}
<option data-link="{value{:Value} text{:Name}} selected{:formData.selectedPlace}}"></option>
{{/for}}
</select>
</script>В этом jsfiddle я пытаюсь отделить свои несколько списков элементов от структуры данных, которую я буду отправлять на сервер: http://jsfiddle.net/hdra2e2d/1/
Вот проблема: только первый элемент имеет текст в раскрывающемся списке выбора! Похоже, все подключено правильно, хотя я не нашел суперпростых или кратких примеров привязки данных к элементу формы SELECT html, так что, возможно, я что-то пропустил, когда пытался согнуть ближайшее возможное совпадение?
справочная информация: цель состоит в том, чтобы получить доступные элементы для нескольких раскрывающихся списков в виде JSON и поместить их в дискретные массивы словарей в элементе «app.selections», связать их с данными и сохранить выбранные пользователем значения в «приложении». .formData», который я буду отправлять на сервер как JSON.
