kendo.bind with nested elements with data-role attribute

[Jaap]

Suppose I have this markup:

<div id="myID">

    <div data-role="tabstrip">

        <ul>

            <li>tab1</li>

            <li>tab2</li>

        </ul>

        <div>

            Content tab 2

            <select data-role="dropdownlist" data-source='{"transport":{"read":"some-url"}}' />

        </div>

        <div>

            Content tab 2

        </div>

    </div>

</div>

When I bind this to a viewmodel

kendo.bind("#myID", viewModel);

then the dropdownlist is initiate twice (and as an effect two requests are done to the server).

This is caused by the fact that kendo.bind iterates through all child elements and calls bindElement for each element (which is ok). The bindElement function looks if the element has a data-role attribute, if so it calls bindingTargetForRole which calls kendo.init(..).
This kendo.init() does a jQuery query for all child elements with a data-role attribute including itsself and initializes each child element.

So in my example when kendo.bind calls bindElement for the tabstrip, the creation of the tabStrip widget causes the dropDownList widget also to be created.
But then kendo.bind iterates further and calls bindElement for the select element and then again the dropDownList widget is created.

I guess this should not be done twice.

Regards, Jaap

[Atanas Korchev]

Hello,

 You are absolutely right. We will fix that in the official release.

Regards,
Atanas Korchev
the Telerik team

[Jaap]

I can confirm this is fixed in the release version.
Thanks, Jaap