data binding to model

[Maxim]

Hi,

Is there a way to data bind selected value to model. I have try to use this, data, and self but it does not work. What does work is creating a nested object and binding it to a user selection.

Below is what I am trying to do but it does not work:

<div id="data-view" data-bind="source: this" data-template="data-view-template">

</div>

<script type="text/html" id="data-view-template">

    <div>

        <input id="search" data-role="autocomplete" data-bind="source: ds, value: this" data-text-field="Name" />

        <div data-bind="text: Value"></div>

    </div>

</script>

$(function () {

    var values = [{ Name: "Foo + Bar", Value: 1 }, { Name: "Foo - Bar", Value: 2 }, { Name: "Foo * Bar", Value: 3 }];

    var model = kendo.observable({

        Name: "???",

        Value: "???",

        ds:  values

    });

    kendo.bind($("#data-view"), model);

});

Below is what I can do but feels funny:

<script type="text/html" id="data-view-template">

    <div>

        <input id="search" data-role="autocomplete" data-bind="source: ds, value: Person" data-text-field="Name" />

        <div data-bind="text: Person.Value"></div>

    </div>

</script>

var model = kendo.observable({

    Person: {

        Name: "???",

        Value: "???",

    },

    ds:  values

});

Thanks,
Max

[Alexander Valchev]

Hello Maxim,

It is not possible to bind the value to "this" keyword, because it refers to the View-Model itself.
The AutoComplete value can be bound to a string or object property. Please check the following examples:

<input id="search" data-role="autocomplete" data-bind="source: ds, value: Value" data-text-field="Name" />

var model = kendo.observable({
    Name: "???",
    Value: "???", //or Value: null,
    ds:  values
});
kendo.bind($("#data-view"), model);

When the value is bound to a string field it will be updated with the value of the AutoComplete's data-text-field. In the value of the widget is bound to object it will be updated with the selected dataItem.

//case one
model.Value: "Foo - Bar"
//case two
model.Value: { Name: "Foo - Bar", Value: 2 }

I hope this information will help.

Kind regards,
Alexander Valchev
the Telerik team