Bind checbox list to dropdownlist in kendo ui by mvvm

[Mohammad]

I have a dropdownlist in my view i want in my view.I want when change my dropdownlist,a java script template bind dropdownlist.i write this but dont work plead help me.

var  roles=[{

        code:1,

        roleName: "Admin",

        access: [

            { id: 1, description: "create", selected: true},

            {id: 2, description: "delete", selected: false},

            { id: 3, description: "update", selected: false}

        ]

    } ,{

        code:2,

        roleName: "user",

        access: [

            { id: 1, description: "create", selected: true},

            {id: 2, description: "delete", selected: true},

            { id: 3, description: "update", selected: false}

        ]

    }];

var viewModel = kendo.observable({

    Roles:roles,

    role:"Admin",

    accessRole:null   

});

 

kendo.bind($("#example"), viewModel);

 

<div id="example">

     Current Role   :<span data-bind="text: role"></span>

    <br>

    <select type="text" id="RoleName" data-bind="source: Roles, value:role"  data-text-field="roleName">

 

   <select/>

 

        <ul data-template="row-template" data-bind="source: accessRole.access"></ul>

 

</div>

 

<script id="row-template" type="text/x-kendo-template">

    <li>

        <input type="checkbox" data-bind="checked: selected" />

        <label data-bind="text: description" />

    </li>

</script>

​

and this is onlne code: http://jsfiddle.net/shahr0oz/K4X3T/19/ ​

K4X3T

[Ä m o l]

Hi Mohammad,

I just changed your code little bit please take a look on it

<div id="example">
     Current Role&nbsp;&nbsp;&nbsp;:<span data-bind="text: role"></span>
     <br>
     <select type="text" id="RoleName" data-bind="source: Roles, value:roleValue" data-text-field="roleName" data-value-field="index">
     <select/>
     <ul data-template="row-template" data-bind="source:accessIndex"></ul>
 </div>
<script id="row-template" type="text/x-kendo-template">
     <li>
         <input type="checkbox" data-bind="checked: selected" />
         <label data-bind="text: description" />
     </li>
</script>

///////////////////////////////////


var roles=[
    {
         code:1,
         roleName: "Admin",
         index:0,
         access: [ 
                         { id: 1, description: "create", selected: true}, 
                         {id: 2, description: "delete", selected: false}, 
                         { id: 3, description: "update", selected: false}
                     ]
     } ,
    {
         code:2,
         roleName: "user",
         index:1,
         access: [ 
                         { id: 1, description: "create", selected: true}, 
                         {id: 2, description: "delete", selected: true}, 
                         { id: 3, description: "update", selected: false}
                     ]
    }
];


var viewModel = kendo.observable({
    Roles:roles,
     role:"Admin",
     roleValue:null,
     accessIndex:function()
     {
         return this.get("Roles")[this.get("roleValue").index].access;
     }
});
viewModel.roleValue=viewModel.Roles[0];
kendo.bind($("#example"), viewModel);

and it works :)
Enjoy.....

to Check  look into this: http://jsfiddle.net/amolkhot/k68G6/

[Mohammad]

hello 
no this is my answer
http://jsfiddle.net/shahr0oz/qK5aW/2/

[Ä m o l]

Good One