选择obsservableArray从表中淘汰记录

-1

试图找出如何设置淘汰赛表中的单选按钮绑定。我希望选择表格上的单选按钮。整个选定的记录在模型中可用。不太确定如何设置无线电输入上的绑定。我假设我需要使用$ parent和一个函数进行值绑定？选择obsservableArray从表中淘汰记录

这里是小提琴。（选定的记录没有做任何事情，现在我想选择的单选按钮，当它被填充）

HTML

<table> 
<thead> 
    <tr> 
    <th>Select</th> 
    <th>First</th> 
    <th>Last</th> 
    <th>Dept</th> 
    </tr> 
</thead> 
    <tbody data-bind='foreach: employees'> 
    <tr> 
     <td><input type="radio" name="employees"></td> 
     <td data-bind='text: first'></td> 
     <td data-bind='text: last'></td> 
     <td data-bind='text: dept'></td> 
    </tr> 
    </tbody> 
</table> 

<div data-bind="with: selectedRow"> 
<h2> 
    Selected Record 
    </h2> 
<p> 
    First: <span data-bind="first" ></span> 
</p> 
<p> 
    Last: <span data-bind="last" ></span> 
</p> 
<p> 
    Dept: <span data-bind="dept" ></span> 
</p> 

</div>

function employee(first, last, dept) { 
    this.first = ko.observable(first); 
    this.last = ko.observable(last); 
    this.dept = ko.observable(dept); 
} 

function model() { 
    var self = this; 
    this.employees = ko.observableArray(""); 
    this.selectedRow = ko.observable({}); 

}; 

var myViewModel = new model(); 

$(document).ready(function() { 
    ko.applyBindings(myViewModel); 
    myViewModel.employees.push(
    new employee("Bob","Jones", "Hr") 
); 
    myViewModel.employees.push(
    new employee("Sarah","Smith", "It") 
); 
    myViewModel.employees.push(
    new employee("John","Miller", "It") 
); 


});

来源

2016-07-23 Bryan Dellinger

你必须执行两个步骤才能使您的代码正常工作。

首先，应用绑定，以单选按钮：

<input type="radio" data-bind="checked: $root.selectedRow, checkedValue: $data" />

checkedValue应包含对应当前无线电按钮的实际值。在这种情况下，我们将$data变量称为整个员工对象，而不是简单（标量）值。

checked绑定应引用包含当前选定员工的observable。

其次，纠正其中selectedRow属性定义行：

this.selectedRow = ko.observable();

千万不要错过空对象为默认值。否则with绑定将无法正常工作。

通过在显示选定员工的第二个块中修改绑定的语法，您将得到类似this的东西。

来源

2016-07-23 18:08:45

选择obsservableArray从表中淘汰记录

回答

相关问题