How can I rebind the dataSourceUrl of Igcombo at runtime?
I found databund method only can request data once.
Hi Spark_li,
The dataBind method is disigned mostly for internal use, though it can be used when application modifed some data related options explicitly within options object and needs to synchronize them with actual runtime internal data source.
To change dataSource application needs only to set that option.1. If valueKey and textKey remain the same, then no extra statements is required.2. If valueKey and textKey in new dataSource is different, then application needs to provide those options too.3. If dataSource is plain array, then setting textKey, valueKey, valueKeyType and textKeyType will not work, because those options within "_setOption" are set one by one and each of them triggers recreating all data and rebinding as well. It means that missing values each time are replaced by calculated values defined by old (not changed yet) settings. In this case, the only suggestion: is to get reference to igCombo.options object, clear data-related member options explicitly and only after that set dataSource or call dataBind. I wrote example for you, which covers all those cases.Note: I did not include #1, because the only thing you will need to do, is to change dataSource. If that is the case in your application, then please do one of the following:$('#myCombo').igCombo('option', 'dataSource', newDataSource);$('#myCombo').igCombo({ dataSource: newDataSource });
Examples for advanced dataSource changes:
<script type="text/javascript"> $(function () { var ds1 = [1, 2, 3, 4, 5], ds2 = ["one", "two", "three", "four"], ds3 = [{a: "a1", b: "b1"}, {a: "a2", b: "b2"}], ds4 = [{x: 1, txt: "x1"}, {x: 2, txt: "x2"}]; $('#combo1').igCombo({ dataSource: ds1 }); $('#ds1').click(function () { var comboOptions = $('#combo1').data('igCombo').options; comboOptions.valueKey = null; comboOptions.textKey = null; comboOptions.valueKeyType = null; comboOptions.textKeyType = null; comboOptions.dataSource = ds1; $('#combo1').igCombo('dataBind'); }); $('#ds2').click(function () { var comboOptions = $('#combo1').data('igCombo').options; comboOptions.valueKey = null; comboOptions.textKey = null; comboOptions.valueKeyType = null; comboOptions.textKeyType = null; $('#combo1').igCombo({ dataSource: ds2 }); }); $('#ds3').click(function () { $('#combo1').igCombo({ valueKey: 'a', textKey: 'b', dataSource: ds3 }); }); $('#ds4').click(function () { $('#combo1').igCombo('option', 'valueKey', 'x').igCombo('option', 'textKey', 'txt').igCombo('option', 'dataSource', ds4); }); });</script><span id="combo1"></span><br /><input type="button" value="ds1" id="ds1" /><input type="button" value="ds2" id="ds2" /><input type="button" value="ds3" id="ds3" /><input type="button" value="ds4" id="ds4" />
Hi, How to bind data source from database?
Thanks,
Kumar
Ravi,
There is an overview on Binding the igCombo to Data in the online documentation:
http://www.igniteui.com/help/igcombo-data-binding
If you have specific questions, please submit them as a new post.