Нокаут, выбираемая строка таблицы

Question

Я использую KO.js для привязки тела таблицы со многими строками. Если пользователь нажимает в любом месте строки, я хочу, чтобы эта строка была выделена.

это мой код ГНФАР

Html

<table border="1"> 
    <thead> 
     <tr> 
      <th></th> 
      <th>Name</th> 
      <th>Last Edited</th> 
      <th>Type</th> 
      <th>Author</th> 
      <th>Preview</th> 
      <th>Delete</th> 
     </tr> 
    </thead> 
    <tbody> 
     <tr data-bind="click: $root.selectItem, css: {'selected':$root.selectedItem() == $data}"> 
      <td style="width: 27px"></td> 
      <td></td> 
      <td></td> 
      <td></td> 
      <td></td> 
      <td>Pre</td> 
      <td>Del</td> 
     </tr> 
    </tbody> 
</table> 

JavaScript

var App = new function() { 
    var self = this; 

// Public Properties 
    self.selectedItem = ko.observable(); 
    }; 
}; 

ko.applyBindings(App); 

Css

.selected 
{ 
    background-color:red; 
} 

это скрипку того, что я так далеко

http://jsfiddle.net/Z53dB/

Есть подобные вопросы на SO, и я последовал за ними до сих пор, но я я не имея большого успеха

Может кто-нибудь посоветовать, на что мне не хватает

благодаря

Answer 1

Вы связываете click с selectItem функция без selectItem функция.

self.selectItem = function(data) { 
    self.selectedItem(data); 
}; 

Пример: http://jsfiddle.net/Z53dB/1/