Переключатель Kendo Привязка Наблюдаемая не обновляет значение при внесении изменений

Question

HTML-код моих радио кнопок:

<div class="slds-form-element" style="text-align:center;">
                    <div id="radio-wrapBorder" style="border-top: 2px solid #f48942;"></div> 
                    <label class="slds-form-element__label" for="radio-wrap" style="color: white; font-size: 15px; margin-top: 5px;">Allow Users To Control Their Drag And Drop Settings:</label>

                    <div class="slds-form-element__control">
                        <div id="radio-wrap">
                            <input type="radio" class="k-radio" id="radioDisableDragDrop" value="DisableAll" name="radioGroup" data-bind="checked: radioDragDrop" style="margin-top: 5px; margin-bottom: 15px;"/><label for="radioDisableDragDrop" class="k-radio-label" id="radioDisableDragDropLabel" style="color: white;">Drag and Drop <b>DISABLED</b> for all users. This will not show up as an option in user settings.</label><br />
                            <input type="radio" class="k-radio" id="radioEnableDragDrop" value="EnableAll" name="radioGroup" data-bind="checked: radioDragDrop" style="margin-top: 5px; margin-bottom: 15px;"/><label for="radioEnableDragDrop" class="k-radio-label" id="radioEnableDragDropLabel" style="color: white;">Drag and Drop <b>ENABLED</b> for all users. This will not show up as an option in user settings.</label><br />
                            <input type="radio" class="k-radio" id="radioUserDragDrop" value="EnableUser" name="radioGroup" data-bind="checked: radioDragDrop" style="margin-top: 5px; margin-bottom: 15px;"/><label for="radioUserDragDrop" class="k-radio-label" id="radioUserDragDropLabel" style="color: white;">Drag and Drop determined by user preferences.</label>
                        </div> 
                    </div>
                </div>

И моя обязательная наблюдаемая это:

var radioObservable = kendo.observable({
                radioDragDrop: null
            });
            kendo.bind($('#radio-wrap'), radioObservable);
            radioObservable.set('radioDragDrop', 'EnableUser');
            console.log(radioObservable);

Где переключатели правильно, сначала выберите все, что я вставил в метод radioObservable.set(). Однако, когда я выбираю другую опцию и нажимаю сохранить... radioDragDrop остается "EnableUser".

Может кто-нибудь увидеть, что не так с этой привязкой, которая может привести к тому, что radioDragDrop не обновляется, когда вы выбираете другую опцию из 3 переключателей?

Answer 1

Я создал DEMO, и привязка переключателей к наблюдаемому объекту, кажется, работает правильно.

Вот фрагмент кода:

JS:

var radioObservable = kendo.observable({
                radioDragDrop: null,
            });
            kendo.bind($('#radio-wrap'), radioObservable);
            radioObservable.set('radioDragDrop', 'EnableUser');//default checked option
            //radioObservable.trigger('change');
            console.log(radioObservable);

$("#save").click(function() {
    alert("current selected option = "+radioObservable.get('radioDragDrop'));
});