如何mvvm数据绑定kendo radiobutton值属性?

时间:2014-10-03 15:44:46

标签: javascript mvvm kendo-ui radio-button

我正在尝试将两个单选按钮与kendo MVVM绑定。但是,它始终默认不选中任何单选按钮。这是剑道MVVM中的错误吗?我期待第一次看到页面时检查其中一个单选按钮。

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>JS Bin</title>

    <link href="http://cdn.kendostatic.com/2014.2.716/styles/kendo.common.min.css" rel="stylesheet">
    <script src="http://cdn.kendostatic.com/2014.2.716/js/jquery.min.js" type="text/javascript"></script>
    <script src="http://cdn.kendostatic.com/2014.2.716/js/kendo.web.min.js" type="text/javascript"></script>

</head>
<body id="main">
    <input type="radio" data-bind="value: Permission.Read, checked: checkedValue" name="RadioGroup0" />
    <input type="radio" data-bind="value: Permission.Modify, checked: checkedValue" name="RadioGroup0" />

    <script type="text/javascript">
        viewModel = new kendo.observable({
            checkedValue: 2,
            Permission: {
                Read: 1,
                Modify: 2
            }
        });
        kendo.bind($("#main"), viewModel);
    </script>
</body>
</html>

http://jsbin.com/bageveta/27/edit?html,console,output

1 个答案:

答案 0 :(得分:2)

使用attr绑定。

<input type="radio" data-bind="attr: { value: Permission.Read }, checked: checkedValue" name="RadioGroup0"/>
<input type="radio" data-bind="attr: { value: Permission.Modify }, checked: checkedValue" name="RadioGroup0"/>

http://jsbin.com/bageveta/30/edit