jquery - モーダルでラジオボタンを選択/選択解除

Question

私はモーダルを持っており、モーダルには特定のコントロールと3つのラジオボタンがあります。ユーザーがラジオ ボタンを選択/選択解除できるようにしたい、またはユーザーが 1 つのラジオ ボタンのみを選択できるようにしたい。ノックアウトjsを使用してデータをモーダルにバインドしています。

モーダル：

<div id="ModalGroup" class="modal hide fade" data-bind="with: Data" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
        <h3 id="myModalLabel">Add Group</h3>
    </div>
    <div class="modal-body">
        <div class="control-group">
            <label class="control-label">
                Group Name
            </label>
            <div class="controls">
                <input type="text" id="GroupName" data-bind="value: GroupName" />
            </div>

            <label class="control-label">
                Group Description
            </label>
            <div class="controls">
                <input type="text" id="GroupDescription" data-bind="value: GroupDescription" />
            </div>

            <label class="control-label">Group Scope</label>
            <div class="controls" id="scope">
                <label class="radio">
                    <input type="radio" id="Local" name="Local" value="Local" />
                    Local
                </label>
                <label class="radio">
                    <input type="radio" id="Global" name="Global" value="Global" />
                    Global
                </label>
                <label class="radio">
                    <input type="radio" id="Universal" name="Universal" value="Universal" />
                    Universal
                </label>
            </div>
            <div class="controls">
                <label class="control-label">
                    Security
                </label>
                <input id="IsSecurity" type="checkbox" checked="checked" data-bind="value: IsSecurity" />
                Is Security?
            </div>
        </div>
    </div>
    <div class="modal-footer">
        <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
        <button class="btn btn-primary" id="CreateGroup" data-bind="click: vm.Save">Create Group</button>
    </div>
</div>

ビューモデル:

vm = {
        Data: ko.observable(),

        Add: function () {
            $("#ModalGroup").modal("show");

            vm.Data(ko.utils.unwrapObservable(ko.mapping.fromJS({
                GroupName: "",
                GroupScope: "",
                GroupDescription: ""
            })));

            if (!vm.Bound) {
                ko.applyBindings(vm);
                vm.Bound = true;
            }
        }
}

関数を使用しようとしまし$('#ModalGroup').show('modal').on()たが、ラジオ ボタンを選択/選択解除できましたが、バインディングがそれに応じて機能しません。すべてをどのようにまとめたかはわかりません。

選択/削除のためのJquery:

$('input[type=radio]').change(function () {
   if (this.checked) {
       $(this).closest('.scope')
         .find('input[type=radio]').not(this)
         .prop('checked', false);
   }
});

Jqueryは私が内部で使用したものです$('#ModalGroup').show('modal').on()