This is a migrated thread and some comments may be shown as answers.

Binding splitter with nested widgets

1 Answer 29 Views
MVVM
This is a migrated thread and some comments may be shown as answers.
Mateusz
Top achievements
Rank 1
Mateusz asked on 18 Jun 2015, 11:43 AM

Hi All,

I started my journey with Kendo MVVM today and immediately I faced this problem. I have view contains div with nested divs. It looks like:

<div id="splitter" class="vsm-splitter" data-role="splitter" data-panes="[
            { collapsible: true, min: '640px', size: '50%', scrollable: false },
            { collapsible: false, min: '300px' },
            { collapsible: true, min: '320px', size: '25%' }]"
    data-bind="visible: isVisible">
    <div>
        @Html.Partial("widget1")
    </div>
    <div>
        @Html.Partial("widget2")
    </div>
    <div>
        @Html.Partial("widget3")
    </div>
</div>

Parent div should be bound to splitter and children divs to widgets. We want to have view model for splitter which is very simple:

var vm = kendo.observable({ isVisible: true });

and have separated view model for each component and bind them one by one. So code can look like that:

kendo.bind($('#splitter'), vm);
kendo.bind($('#widget1Root'), vmW1);
kendo.bind($('#widget2Root'), vmW2);
kendo.bind($('#widget3Root'), vmW3);

but it causes following error:

Uncaught TypeError: undefined has no properties

When I replace Partial with static text it works ok. Do you know how I can proceed with that kind of issue? Any suggestion?

Best Regards,
Mateusz

1 Answer, 1 is accepted

Sort by
0
Daniel
Telerik team
answered on 22 Jun 2015, 02:26 PM
Hello,

I am afraid that the scenario is not supported. The bindings cannot be nested. You should use a single ViewModel and bind only the main element.

Regards,
Daniel
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
Tags
MVVM
Asked by
Mateusz
Top achievements
Rank 1
Answers by
Daniel
Telerik team
Share this question
or