jquery - Is it possbile to use Kendo MVVM inside of MarionetteJS ItemView or Layout? -

in project, page developed using marionettejs layouts kendoui libraries, inside application views implement kendo mvvm in specifc views, possible? or should need manual event handling , rerendering views?

as sample tried below, don't have skill on marionettejs, please advise me on possible other better approaches.

http://jsfiddle.net/kendodev/jcdyn/14/

<header> <h2>kendo mvvm marionette</h2>     <script type="text/html" id="sample-template">         <%= value1 %></br>        <label> duration:  </label>    <input id="duration" type="text" data-bind="value: durationvalue" />        <button id="mybutton">increase duration</button> </script>  </header>  <div id="container"class="well"> <div> 

many in advance!!

can try this?

<header> <h2>kendo mvvm marionette</h2>     <script type="text/html" id="sample-template">         <%= value1 %></br>        <label> duration:  </label>        <button id="mybutton">increase duration</button> </script> </header> <input id="duration" type="text" data-bind="value: durationvalue" />    <div id="container"class="well"> <div> 

and java script content is:

var sampleview = backbone.marionette.itemview.extend({     template : "#sample-template",     events :{     "click #mybutton" : "increaseduration"     },      increaseduration : function () {       var value = parseint(viewmodelduration.get("durationvalue"));         value = value+1;         viewmodelduration.set("durationvalue",value);     }                                                     });     var viewmodelduration = new kendo.data.observableobject({                               durationvalue: 1                           }); var value = parseint(viewmodelduration.get("durationvalue")); var samplemodel = backbone.model.extend({     defaults : {         value1 : value, //"value viewmodelduration",  how assign??         } }); var samplemodel = new samplemodel(); viewmodelduration.bind("change", function(e) {         value = parseint(viewmodelduration.get("durationvalue"));       samplemodel.set({value1: value});      sampleview.render();     });  var sampleview = new sampleview({     model:samplemodel,      el : '#container' }); sampleview.render(); kendo.bind($("#duration"), viewmodelduration); 

[answer] updated fiddle:

http://jsfiddle.net/kendodev/jcdyn/15/