angularjskendo-uikendo-combobox

Kendo UI: Combo box shows value instead of Text


I am using Kendo UI with AngularJS. I am having trouble fixing an issue.

If a model is set to an ID which is not present in the datasource the combobox is bound to, the value is shown in the dropdown as is. i.e. if I set the model to 4 and there is no data item in datasource with ID 4, the combobox shows 4 as is. I want to replace it with empty string. How can I change it to show empty textbox instead?

see the sample

PS. the problem is not limited to Angular. Kendo's own MVVM binding has the same issue.


Solution

  • Well, since it is not dropdown but combobox and so you can write every text inside it, I am afraid you will have to make your own check.

    Value property just set a value and in case of combo box, if value not match with item in data source then it just set value to the input box.

    To make a check I would use dataBound event which is started once after component is created. Because it is launched after component is created you can easily compare selected value with values in data source.

    Small demo here. Hope it helps.