Knockout.jsのラジオボタンリスト

Question

ラジオボタンのリストを作成して、ラジオボタンをクリックしてラジオアイテムを確認できるようにしようとしています。私がChromeでうまく動作しますが、IE7ではうまく動作しません。取得したHTMLは正しいと思われますが、ラベルをクリックすると対応するラジオボタンが選択されません。

は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 --> 

これを行うための好ましい方法は何ですか？

Answer 1

これはKnockout（2.1.0）の最新バージョンとして正しく動作しているようです。

Answer 2

私はknockout.jsに慣れていませんが、ラベルを入力ボックスに囲むだけで、通常はラベルを入力にバインドできます。

http://jsfiddle.net/QD2qC/

Answer 3

あなたのHTMLが細かいように見えます。これは、動的に生成されたラベルのクリックを認識できないIE7の奇妙なものです。

あなたは正しい答えを見つけることができない場合は、いつでもthis workaroundを使用することができます。

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

私は動的に生成され、これらのラベルを考慮してon()代わりのclick()を使用して、わずかにそれを変更しました。