将CSS运行时添加到表行中，并将数据绑定到该行

我真的不确定如何解决.但是，我已经很接近解决方案了，现在只需这里的专家们一点帮助.我的工作提琴是此处.页面加载时，将选中2个复选框.我的视图绑定如下

I am really not sure how to solve. However i am quite close the solution and now just need one small help from you experts here. My working fiddle is here. When the page loads the 2 checkboxes are checked. My view is binded as below

 <tbody data-bind="foreach: dataOne">
    <tr  data-bind="css: { 'makeBold': $root.duplicates.indexOf(name1) !== -1 }" >
        <td data-bind="text: id"></td><td >&nbsp;&nbsp;&nbsp;</td>
        <td data-bind="text: display"></td><td >&nbsp;&nbsp;&nbsp;</td>
        <td>&nbsp;</td>
        <td>
            <input type="checkbox" data-bind="checked: $root.duplicates.indexOf(name1) !== -1" />
        </td>
    </tr>
</tbody>

我的视图模型如下

var data1 = [{
name1: "one",
id: 1,
display: "Test1"
}, {
 name1: "two",
id: 2,
 display: "Test2"
}, {
name1: "three",
id: 3,
 display: "Test3"
}];
var data2 = [{
name2: "five"
}, {
name2: "two"
}, {
name2: "three"
}];

var viewModel = {
dataOne: ko.observableArray(data1),
dataTwo: ko.observableArray(data2),
duplicates: ko.observableArray()

};

 viewModel.dataTwo.push({
  name: "four"
  }); //add one on the end

  var flattenedOne = ko.utils.arrayMap(viewModel.dataOne(), function (item) {

     return item.name1;
   });

  var flattenedTwo = ko.utils.arrayMap(viewModel.dataTwo(), function (item) {

   return item.name2;
  });

  var differences = ko.utils.compareArrays(flattenedOne, flattenedTwo);
    //return a flat list of differences
  ko.utils.arrayForEach(differences, function (difference) {
   if (difference.status === 'retained') {
      viewModel.duplicates.push(difference.value);
    }
   });

现在，当用户单击更新"按钮时，它将再次加载数据，现在选中了3个复选框.我要达到的目标是

Now when user click on Update button it again load data and now 3 checkboxes are checked. What i am trying to achieve is

1. 当用户单击更新"按钮时，应将css添加到表行中，并仅使该行变为粗体.

1. When user click on update button it should add css to table row and only make that row bold.

当用户单击更新按钮时，不应选中该复选框.

It should not check the checkbox as checked when user click's on update button.

因此，在我们的示例中，当用户单击更新"按钮时，应将行设置为粗体，但不应选中此复选框.因此，只有第一行在单击更新"按钮时才会以粗体显示.当前，当页面正在加载时，它使两行变为粗体，并检查这是错误的.仅单击更新按钮即可使行变为粗体.请帮助我.

So in our example when user click's on update button it should make row as bold but checkbox should not be checked. So only first row will be bold on clicking update button. Currently when page is loading it is making 2 rows bold and checked which is wrong. It should make row bold only clicking update button. Please help me guys.