剑道UI "checked"外部模板中最后一个单选按钮的MVVM绑定不工作

我有一个非常有趣又令人烦恼的问题要解决。我正在使用MVVM剑道UI模式进行项目，我有data-bind: checked单选按钮的问题。

当我使用data-bind将一些变量从VM绑定到视图时，它被成功地绑定到所有单选按钮，除了最后一个。因此，每当我将无线电值更改为最后一个时，VM中的变量不会更改，因此不会调用此变量的附加侦听器。

<div data-role="modalview"
     class="dialogStyle width60em"
     data-hide="kitkat.widgets.zivotniPojisteniDialog.hide"
     data-model="kitkat.widgets.zivotniPojisteniDialog"
     data-init="kitkat.widgets.zivotniPojisteniDialog.init">  
    <div class="dialogContainer kitkat-switches">
        <form id="form">
            <div data-role="scroller" class="scroller">
                <div class="row">
                    <span data-bind="source: nameSource" data-template="name-tmpl"></span>
                    <script type="text/x-kendo-template" id="name-tmpl">
                        <input type="radio" name="firstname" value="#= idx#" data-bind="checked: nameSelectedValue" 
                                   id="firstname#= idx#" />
                        <label class="black" for="firstname#= idx#">#= name#</label>
                    </script>
                </div>
                <div id="tables">
                    <!-- example tables, originally created by nested external templates -->
                    <table id="table0" data-bind="visible: firstnameChanged">
                        <tr class="row">
                            <td class="firstColumn"></td>
                            <td class="secondColumn"></td>
                            <td class="thirdColumn"></td>
                        </tr>
                    </table>                               
                    <table id="table1" data-bind="visible: firstnameChanged">
                        <tr class="row">
                            <td class="firstColumn"></td>
                            <td class="secondColumn"></td>
                            <td class="thirdColumn"></td>
                        </tr>
                    </table>                               
                    <!-- - - - - - - -->
                </div>
            </div>
        </form>
    </div>
</div>

JS viewmodel:

<script>
var _dialog = kendo.observable({
        // hardcoded data for this example
        nameSource: [
            {
                "idx" : 0,
                "name" : "John"
            },
            {
                "idx" : 1,
                "name" : "George"
            }
        ],
        nameSelectedValue: null, // problematic variable
        init: function(e) {
            var self = _dialog;
            self._view = e.sender;
            self._view.shim.popup.options.animation.open.effects = "slideIn:down";
            $(self._view.element).closest('.km-shim').addClass('dialogs-shim');
            self.initView("form");
            self.bind("closed", function() {self.hide();});
        },
        show: function(jeProDeti) {
            var self = _dialog;
            self._view.open();  
        },
        hide: function() {
        },
        cancel: function() {
            kitkat.touch( function() {
                var self = _dialog;
                self.trigger('done');
                self._view.close();
                self.trigger('closed');
            });
        },
        firstnameChanged: function(e) {
            var self = _dialog;
            var idx = e.idx;
            var selectedIdx = parseInt(self.get("nameSelectedValue")); // getter for registering "nameSelectedValue" change
            if(idx === selectedIdx) { // table is visible if corresponding radio value is selected
                return true;
            }
            return false; // otherwise it is invisible
        }
    });
</script>

谢谢你的建议