I would like to submit a workaround I found which can be used for one of the documented limitations of igcombo as specified on https://www.igniteui.com/help/igcombo-known-limitations
The following one to be specific :
Initial selection won't be reflected if the item is currently not present in the page loaded by the combo.
My workaround does have some drawbacks, it triggers an extra roundtrip, but showing a page where the combo clearly should have a value where it is not filled in, simply is not a very good option for me, though I can understand the complexity of implementing such a thing.
What follows is the workaround:
<script type="text/javascript"> function comboDataBound(e, ui) { $("#DOMAIN_ID").igCombo({ dataBound: function (evt, ui) { ui.owner.index(0); $("#DOMAIN_ID").igCombo({ dataBound: null }); } }); ui.owner.filter("@Model.DOMAIN_NAME", null); }
$(document).ready(function () { $('#DOMAIN_ID').igCombo({ width: "280px", validatorOptions: { required: { errorMessage: 'The DOMAIN field is required.' }, lengthRange: { errorMessage: 'The field DOMAIN_ID must be a string with a maximum length of 9.', min: null, max: 9 }, messageTarget: 'DOMAIN_ID' }, loadOnDemandSettings: { enabled: true, pageSize: 20 }, filteringType: 'remote', filteringCondition: 'startsWith', responseDataType: 'json', responseDataKey: 'value', responseTotalRecCountKey: 'odata.count', textKey: 'NAME', valueKey: 'ID', footerTemplate: '<div class=\'boxed\'>Domain Count: {0} of {3}</div>', dataSource: '../../odata/Domain?$select=NAME,ID&$orderby=NAME', inputName: 'DOMAIN_ID', placeHolder: "Please, select a domain", noMatchFoundText:'Domain not found', dataBound: function (evt, ui) { return comboDataBound(evt,ui); } }); }); </script>
Note that I am not a javascript expert but the idea is to use the databound event, which is triggered when the first databinding is complete, with the default ajax call is done which retrieves only the very first items in the list, the list that does not contain the initial value. At that moment I install a different databinding eventhandler which in turn will set the event handler yet again, but to null, and initialises the selected index to 0, hence displaying my selected item in the editable text as I want.
I think this works well for a single select combo. Pity that I need this extra roundtrip, and that the code is jerky but all in all I hope an acceptable workaround worth sharing.
Hello Philip,
Thank you for contacting Infragistics Developer Support and thank you for your workaround snippet of code.
We'll update our workaround page for the igCombo control with your suggestion.
The workaround is still not available on the workaround page.
I am trying to create a sample in order to clearly understand what is actually doing the proposed workaround. Could you please take a look and let me know what I am missing (update the sample).
http://jsfiddle.net/zdravko/3bg2ukza/1/
As you can see, I set 13th item to be selected (which is not part of the fetched data), altough with the code proposed by you, the selected item is always the first one (index 0)?
http://jsfiddle.net/stuyckp/3bg2ukza/31/ contains the fiddle with my way of working
Note that I am using odata and that the filter operation is key!
Is there something else that I should provide?