Recover Text and Value from Select with KENDO MVVM

Question

I need the help of you, who have knowledge in KnockoutJS

I have something like that:

var viewModelPessoa = kendo.observable({
    Contatos: [],
    FormContato: {
        TipoContato: -1, //Aqui vai o indice/value do select/option
        TipoContatoTexto: null, //Aqui vai o text do select/option
    },
    AddToContato: function() {
         this.get("Contatos").push({
            TipoContato: this.get("FormContato.TipoContato"),
            TipoContatoTexto: this.get("FormContato.TipoContatoTexto"),
         });
    }
});

And on my page I have the following:

<select id="listaTipoContatos" data-bind="value: FormContato.TipoContato">
    <option value="-1"> Não informado </option>
    <option value="0"> Telefone Residencial </option>
    <option value="1"> Telefone Comercial </option>
</select>

How do I do it? I put something like <select id="listaTipoContatos" data-bind="value: FormContato.TipoContato,text: FormContato.TipoContatoTexto"> ?

Answer 1

The correct bind syntax of a select, according to the documentation of Knockout is like this:

<select data-bind="options: availableCountries,
                   optionsText: function(item) {
                       return item.countryName + ' (pop: ' + item.countryPopulation + ')'
                   },
                   value: selectedCountry,
                   optionsCaption: 'Choose...'"></select>

I have no experience with Kendo, but I imagine in this case you should pass the "Contacts" on options, and specify the right attributes to use as value.