Question

Am I able to bind the optionsValue of a select list to the index of
the particular item in the option array?

<select data-bind="options: options,  optionsText: 'text', 
optionsValue: ko.utils.arrayIndexOf(**somevalue**)" /> 

Or am I stuck with having to transform my options object from

{ 
    text: 'asdasd' 
} 

to

{ 
   text: 'asdasd', 
   id: 0 
} 

and doing

<select data-bind="options: options,  optionsText: 'text', 
optionsValue: 'id' /> 

Thanks

Answer 1

If you are communicating via JSON rather than submitting a form, then you can have the selected value be your object and create a dependentObservable to represent the index of it like:

function ViewModel() {
    this.choices = ko.observableArray([
        { text: "index zero" },
        { text: "index one" },
        { text: "index two" }
    ]);
    this.selectedChoice = ko.observable();
    this.selectedChoiceIndex = ko.dependentObservable(function() {
        return this.choices.indexOf(this.selectedChoice());
    }, this);
};

Sample: http://jsfiddle.net/rniemeyer/hevTF/

If you are submitting a form and are relying on the value attribute of the selected option element, then you would want to add the index to your object (as you had suggested). The other option is to emit the option elements in a jQuery template using {{each(item, index)}} like: http://jsfiddle.net/rniemeyer/h6wLr/