2013-12-03 4 views
10

Я использую НокаутJS и durandalJS 2.0. Я динамически добавляет два выпадающих списков на основе записей таблицы базы данных и заполняя их данными из другой таблицы. В каждом раскрывающемся списке также установлен флажок . Как получить выбранные раскрывающиеся значения?Получить выбранные значения из динамически созданных выпадающих списков

enter image description here

модели

var dataToAdd = { 
    mydata_Id: ko.observable(), 
    mydata_Name: ko.observable(), 
    mydata_data: ko.observableArray([dataTask]) 
}; 

var dataTask = { 
    taskId: ko.observable(), 
    dropdownId: ko.observable() 
}; 

var taskList=ko.observableArray([]);//get data from database table. Consider there are two entries. 
var dropdownData=ko.observableArray([]); //get the dropdown data 

Посмотреть

//Since *taskList* has two entries, two dropdowns with their respective checkbox will get generated. 
<div data-bind="foreach:taskList"> 
    <label><input type="checkbox" data-bind="checked: true" /> 
    <span data-bind="text:Name"></span></label>  

    <select data-bind="options: $root.DropdownData, optionsValue: 'Id', optionsText: 'Name', optionsCaption: 'Select...', value: $root.dataTask.dropdownId</select> 
</div> 

Первый: Как получить выбранное значение для каждого из выпадающего списка, когда я попал в ADD кнопка? Когда я использую значение: $root.dataTask.dropdownId, оба раскрывающихся списка изменяются на одно и то же выбранное значение. Когда я установите флажок, раскрывающийся должны быть включены, и после выбора, я должен быть в состоянии обновить observable массива, как показано ниже:

{taskId:44,dropdownId:10},{taskId:55,dropdownId:11} 

Второго: Кроме того, когда я снимите флажок, соответствующее падение -down должен быть отключен, и запись должна быть повторно перенесена из массива observable.

+4

Можете ли вы сделать скрипку? – Damien

+1

Если оба элемента 'select' используют' значение: $ root.dataTask.dropdownId', они указывают на держатель значения _same_. Таким образом, поведение, которое вы описываете. Вам нужно будет настроить раскрывающийся список, чувствительный к контексту, но с предоставленными фрагментами, которые трудно дать руководство по пути достижения этого. – Origineil

ответ

4

Ваш вопрос много неопределенности в ней, тем не менее, я включил рабочую скрипку, демонстрирующее то, что вы ищете -

http://jsfiddle.net/Lxt7E/1/

<div data-bind="foreach: Dropdowns"> 
    <label><input type="checkbox" data-bind="checked: checkedObs" /> 
    <span data-bind="text: label"></span></label>  

    <select data-bind="disable: checkedObs, options: theseOptions, optionsText: 'Name', optionsCaption: 'Select...', value: selectedOption"></select> 
</div> 

<button data-bind="click: addButton">Add</button> 

В двух словах, что вы можете сделать, это создать экземпляры модели, такие как «выпадающее меню» в этом случае, и использовать привязку foreach для нокаута для отображения их числа n. Экземпляр выпадающего списка содержит наблюдаемые данные, которые выполняют то, что вы ищете, и их можно использовать в функции add, чтобы решить, следует ли записывать значения или w/e.

Смежные вопросы