Danh sách nút radio với Knockout.js

Question

Tôi đang cố xây dựng danh sách các nút radio có nhãn để bạn có thể nhấp vào nhãn để kiểm tra mục radio. Những gì tôi đã làm tốt trong Chrome, nhưng không phải là IE7. HTML mà có được nhổ ra có vẻ như nó là chính xác, nhưng khi tôi nhấp vào nhãn, nút radio tương ứng không được chọn.

Javascript

function ReuqestType(id, name, billable) { 
    this.id = id; 
    this.name = name; 
    this.billable = billable; 
} 

function RequestViewModel() { 
    var self = this; 

    self.availableRequestTypes = [ 
     new ReuqestType(1, "Travel", true), 
     new ReuqestType(2, "Bill Only", false), 
     new ReuqestType(3, "Both", true) 
    ]; 

    self.selectedRequestType = ko.observable(); 
} 

HTML

Request Type 
<br /> 
<!-- ko foreach: availableRequestTypes --> 
<input type="radio" name="requestType" data-bind="value:id, attr: {'id': 'rt'+ id}" /> 
<label data-bind="text: name, attr:{'for':'rt'+id}"> 
</label> 
<!-- /ko --> 

cách ưa thích để làm điều này là gì?

Answer 1

Điều này có vẻ đang hoạt động chính xác ngay bây giờ kể từ phiên bản Knockout mới nhất (2.1.0).

Answer 2

Tôi không quen thuộc với knockout.js, nhưng bạn thường có thể kết buộc nhãn với đầu vào chỉ bằng cách làm cho nhãn quấn quanh hộp nhập liệu.

http://jsfiddle.net/QD2qC/

Answer 3

Dường như HTML của bạn không sao. Nó có thể là một quirk của IE7 không thể xác nhận nhấp chuột của nhãn đã được tạo động.

Nếu bạn không thể tìm thấy một câu trả lời thích hợp, bạn luôn có thể sử dụng this workaround:

$('label').on('click', function() { 
    var labelId = $(this).attr('for'); 
    $('#' + labelId).trigger('click'); 
}); 

Tôi đã thay đổi nó một chút bằng cách sử dụng on() thay vì click() để giải thích cho các nhãn này được tạo ra tự động.