How do we get the selected value from a combo box using an observable binding?
We noticed that there isn't a method of obtaining the value or selected value. But there is a property for selected items. I see in the example on Ignite UI that they use a view model method to find the actor internally. Is this the only way of getting the selected value?
What if our arrays contain thousands of records? Do we have to loop through all records to find our match?
Hi, Daniel.
Thank you for using our product and I hope that I will help you with the following answer.
You can get the igCombo text that is shown in the input using the "text" method:
$("#combo").igCombo("text")
You can get the igCombo value using the "value" method:
$("#combo").igCombo("value")
You don't need to iterate over all the records. Here you can find reference to all the igCombo methods.
The loop that you are looking is, I guess, in the following sample. There all the items are added to observable array, because we can add and remove items to the drop down collection. The igCombo supports also this scenario, when you add or deleted items from the data source in the Model, then the igCombo items list are also updated. This happens without the need to rebind the igCombo with the new data. But this is different binding from the one in the igCombo text input. If you want only the text there to be updated, and your list items are static, you need only observable for the igCombo input, which in the previous example is done using the following code:
this.actorName = ko.observable(self.actors()[0].name);
The Knockout extension for the igCombo is done in way that the observable item is the "text" one. If you want to make the "value" of the igCombo to be observable, instead of the "text", you need to do this manually. You can use the "selectedIndex" method and then use "itemByIndex" method to get the selected list item. Then having the value, which is observable, you can notify manually that it is changed. I don't know if this is the case your trying to achieve, sorry if you mean something else. If you want to observe the "text", this is done automatically by the igCombo, cause this is the expected observed value in most of the cases.
For any further questions, don't hesitate to ask.
Best regards,
Nikolay Alipiev
Check out the data source for actors. It provides a name and an ID. For display purposes, which are interested in showing the name. But behind the scenes the ID is our primary key. Therefore, we would prefer to bind the ID instead of the name. At the moment, the API does not support that. When the data source is a Key/Value pair, we are constricted in using just the KEY.
I understand we can call the igCombo API to obtain the value directly, but this violates the KO pattern of decoupling the control and our models.
Another example: In HTML when we want to display a SELECT list we can do the following:<select> <option value="nm0001191">Adam Sandler</option> <option value="nm0000222">Brooke Shields</option> . . .</select>The actor name shows up the drop down list, but obviously the developer wants the underlying value for any behind the scenes work. When utilizing Knock Out, the value of the options are the important piece of data and currently the API doesn't NOT support a way for Knock Out to notify our models of that selected value. Currently I am stuck with just the name, then I'd have to iterate over the data source to find the value. And if I have hundreds of records, it is not optimal.
The ideal solution is to be able to obtain the value via binding without knowing the control it is bound too. We should not have to use the igCombo API to get it either. "Text" works great. But we need a similar implementation to obtain the "Value."
Hopefully I explained it thoroughly.Thanks,
I have investigated this issue, and I have logged this behavior in our internal tracking system with a Development ID of 166340 - allow the igCombo "value" to be observable. It's not implemented for the moment, but we will do it and we will inform you about the progress. If you need more information, don't hesitate to ask us.
Thanks for the patience and for using our product.
I just wanted to inform you that the functionality we've discussed in the thread, is implemented. It will be available with the next service release in the coming month. You will be able to wrap the igCombo value as observable. Next month the help will be also updated, and you will be able to find more information in the following topic. You will be updated when the packages are ready for download. Meanwhile if you have some other questions, don't hesitate to ask.
You can download the latest service release and see how the functionality, we discussed in this thread, is implemented. If you have some problems or some suggestions or any feedback, I will be glad to discuss it. The topic is not updated yet, but you can just set the "value" property and it should work.
I will wait for your feedback.
Thanks Nikolay,
We will work this into our next release.