Bind to tabstrip buttons

[Daniel]

I know i am missing something simple.


I need to bind functions to my tabstrip buttons.

Here is my layout

<div id="divResults" data-role="layout" data-id="results" data-model="APP.models.results">
    <div data-role="header">
        <div data-role="navbar">
            <a id="back-button" class="nav-button" data-align="left" href="views/home.html" data-role="backbutton" data-icon="arrow-l">Back</a>
            <span data-role="view-title"></span>
        </div>
    </div>

    <!-- application views will be rendered here -->

    <div data-role="footer">
        <div data-role="tabstrip">
            <a href="views/home.html" data-icon="home">Home</a>
            <a href="views/books.html" data-icon="bookmarks">Results</a>
            <a data-bind="click: testme" data-icon="settings">Settings</a>
            <a href="views/about.html" data-icon="about">About</a>
        </div>
    </div>
</div>

and here is my model...

window.APP = {
    models: {
        home: {
            ........
        },
        settings: {
            title: 'Settings'
        },
        results: {
            title: 'Books',

            ds: new kendo.data.DataSource({
        ........
            }),


            testme: function () { alert("Test"); },

    }
}

What am i missing?

[Tina Stancheva]

Hello Daniel,

Using MVVM bindings inside the layout is not supported out of the box. In this blog post you can learn more about this limitation and find a possible workaround. Please consider the information and let us know if you have more questions.

Regards,
Tina Stancheva
Telerik