2012-01-16 28 views
8

Tôi cố gắng để sử dụng loại trực tiếp để ràng buộc một nhấp chuột vào một hàng trong một bảng như thế này:Knockoutjs - Bảng Row Nhấn Binding, muốn loại bỏ các cột từ Bấm tổ chức sự kiện

<tr data-bind="click: $root.selectItem"> 

Nó hoạt động tuyệt vời. Vấn đề là khi tôi cố gắng loại trừ các cột nhất định khỏi thực hiện hành động nhấp chuột. Tôi có các nút chỉnh sửa và xóa trong hàng của mình và tôi không muốn chúng kích hoạt sự kiện clickItem. Tôi sẽ chỉ cần phải ràng buộc tất cả các td của tôi muốn cư xử theo cách này để các sự kiện click hoặc là có một cách dễ dàng hơn để làm điều đó?

Fiddle ở đây: http://jsfiddle.net/blankasaurus/WYKEM/

Trả lời

20

Cập nhật: bạn tránh được một phong tục ràng buộc bằng cách thêm clickBubble: false như thêm ràng buộc với click ràng buộc theo đề nghị của Kevin Obee và chứng minh trong mẫu này: http://jsfiddle.net/kevinobee/Q25ja/2/

gốc: Bạn có thể sử dụng một ràng buộc tùy chỉnh kết thúc tốt đẹp ràng buộc click và ngăn các sự kiện khác xảy ra. Nó có thể trông giống như:

ko.bindingHandlers.clickAndStop = { 
    init: function(element, valueAccessor, allBindingsAccessor, viewModel, context) { 
     var handler = ko.utils.unwrapObservable(valueAccessor()), 
      newValueAccessor = function() { 
       return function(data, event) { 
        handler.call(viewModel, data, event); 
        event.cancelBubble = true; 
        if (event.stopPropagation) event.stopPropagation(); 
       }; 
      }; 

     ko.bindingHandlers.click.init(element, newValueAccessor, allBindingsAccessor, viewModel, context);  
    } 
}; 

Đây là một mẫu: http://jsfiddle.net/rniemeyer/xj7Hs/

+2

1 vĩ đại giải pháp! –

+0

Đó là một giải pháp rất tiện lợi. –

Các vấn đề liên quan