Mobile button + MVVM + Templating - button does not renders

[Alex]

Following issue: MVVM model contains groups array, for each group we create a DIV with some information (fields) using source binding and data-template attribute. Each div contains a button, which is suppose to be a mobile button, but it does not render as a mobile button. I simplified my example - each div has simply a button:

<div id="test" data-role="view" data-model="viewModel">

    <div data-bind="source:groups" data-template="groupsTemplate"></div>

    <button data-role="button" data-bind="click:buttonClick">Add new Button</button>

</div>

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

    <button data-role="button" data-bind="text:caption"></button>

</script>

and a viewModel:

var viewModel = kendo.observable({

    caption: "buttons",

    groups:[

        {name:"button1", caption:"First", error:""},

        {name:"button2", caption:"Second", error:""},

        {name:"button3", caption:"Third", error:""}

    ],

    buttonClick: function(){

        this.groups.push({name:"button4", caption:"Forth", error:""});

    }

});

//kendo.bind($('#test'), viewModel);

new kendo.mobile.Application();​

the result is: http://jsfiddle.net/S7edM/2/ 

Of course if I uncomment line with kendo.bind, and remove data-model attribute from root div it renders correctly, since it created mobile application on already existing DOM, but if I need to add a new button, it does not renders to mobile button.

General question: If I have different mobile components like switch, list view etc. in such "groups", which are added and removed through templates and view model, do I have any "afterAdd" and "beforeRemove" events, and is there any kendo mobile method to init newly created DOM elements? 

[Petyo]

Hello Alex,

I am glad to inform you that this issue is already addressed in our latest internal build. One thing to keep in mind is that the button widget does not expose a bindable text option - so you should use a regular template interpolation.

<script id="groupsTemplate" type="text/x-kendo-template">
    <button data-role="button">#: caption #</button>
</script>

Greetings,
Petyo
the Telerik team