Hello,
I am using a combobox within an igGrid and implemented everything according to the following forum post:
http://es.infragistics.com/community/forums/p/72892/370474.aspx
The only difference is that I am using oData and not local data.
I can fill the combobox and edit the values in the grid.
However, I am unable to fill the lookup array for the formatter function.
Here I setup my lookup data source: (TypeScript)
var mediasSchema = new Infragistics.DataSchema("json", { fields: [ { name: "ID", type: "number" }, { name: "Name", type: "string" } ], searchField: "value" }); this.medias = new Infragistics.RemoteDataSource({ autoCommit: true, responseDataKey: "value", responseDataType: "json", responseContentType: "application/json; charset=utf-8", dataSource: host + 'odata/Medias?$select=ID,Name', schema: mediasSchema, dataBound: () => this.fillMediaNameLookup(this._lookupMediaList) });
And then I call:
(<any>this.medias).dataBind();
By the way, the TypeScript declaration of dataBind is not correct in Infragistic's ".d.ts" file. That's why I have to do the casting.
I use the dataBound event to fill the lookup array.
Unfortunately, the data source is still empty when the dataBound event is raised.
I can see in the browser's debugging tools that the dataBound event is called even before the JSON is returned and processed.
Is this a bug?
If yes, I would need a fix asap. If not, can you modify the sample from the forum post that I mentioned above so that it works with oData. (Both, the table data and the lookup data comes from an oData source.)
Thanks!
Joern
Hello Joern,
We may need more information regarding the igGrid definition. If possible please attach a copy the igGrid definition code together with your reply. If you have any questions, please let us know.
Hello Vivian,
here is my grid definition:
{ dataSource: products, responseTotalRecCountKey: 'odata.count', primaryKey: 'ID', virtualization: false, virtualizationMode: 'fixed', autoCommit: true, columns: [ { headerText: 'Product ID', key: 'ID', dataType: 'number', width: '20%' }, { headerText: 'Product Name', key: 'Name', dataType: 'string', width: '50%' }, { headerText: 'Media', key: 'MediaRef', dataType: 'number', formatter: lookupMediaName, width: '30%' }], caption: 'Test', height: '300px', width: '80%', features: [ { name: 'LoadOnDemand', chunkSize: 5, type: 'remote', loadTrigger: 'button' }, { name: 'Sorting', applySortedColumnCss: false, featureChooserSortAsc: 'Sort A to Z' }, { name: 'Filtering', type: 'remote', mode: 'simple' }, { name: 'RowSelectors', enableCheckBoxes: true, enableRowNumbering: false }, { name: 'Selection', multipleSelection: true }, { name: 'Updating', enableAddRow: false, columnSettings: [{ //The combo is defined as an editor provider. Combo options are defined under 'editorOptions'. columnKey: 'MediaRef', editorType: 'combo', required: false, editorOptions: { mode: 'dropdown', dataSource: medias, responseDataKey: 'value', textKey: 'Name', valueKey: 'ID' } }] }] }
Best regards,
Thank you for the code.
Let us comment out databind() on medias. Please let me know if the issue persists. If you have any questions, please let me know as well.
if I remove databind(), the dataBound event is never called and the lookup list is empty.
Could you modify Infragistic's sample from
so that it uses OData for the data source and the lookup?
Thank you!
in your first alternative you wrote: "and format after binding, but right before rendering." - How do you do this? - Can you edit your sample to demonstrate this approach (using two OData sources)? Thank you!
I tried your second alternative using "dataBound" instead of "callback". It did not work. The documentation is not clear what the differences between this two events are.
Here is Vivian's answer on my support case for anyone following in the forum:
Hello Joern, Good afternoon.Thank you for the information. Using the details you have provided, I reviewed the sample a few times more. The sample's grid binds to a datasource called products which is empty. The grid also has a dropdown editor. The dropdown editor is bound to a datasource called ds. the Datasource ds is an oData which is re-formatted on the LookUp function. The LookUp function is called after the grid's definition. At this point the editor and the grid are already bound but not rendered. The LooUp function is called before the grid is rendered, therefore the list is not displayed until the LookUp function is called. I think this is the difference between our approaches. I see that you are binding the oData to medias using RemoteDataSource to the LookUp function. This is ok if partnered with a timeout or an interval to give the datasource time to bind. We have 2 alternatives on this scenario. We can let the binding occur on both the grid and the editors using the unformatted datasource and format after binding, but right before rendering. On this thought, the medias gets the data from the RemoteDataSource without binding and call the lookup within the functions which holds the grid's definition right after the grid' definition statement. Or, as an alternative, we keep the databind on RemoteDataSource. On RemoteDataSource's success callback, we call the grid definition. A function can be called on callback. Callback is triggered databinding is complete. With more information on callback, you may refer to the following documentation:http://help.infragistics.com/jQuery/2013.2/ig.remotedatasource If you have any questions, please let me know as well. Please let me know if one or both approaches a feasible on your end or otherwise. Sincerely,VivianDeveloper Support EngineerInfragisticswww.infragistics.com/support
if you mean that both are ig.DataSources bound to OData - than, yes, correct.
If you mean that both are the same data source - than, no, of course they are two separate data sources.
It's a typical business use case:
For example a list of addresses (data source 1) and a lookup for the state (FL. NY, etc. - data source 2).
In this case you cannot display the list of addresses (data source 1) in the igGrid before you have loaded the list of states (data source 2).
Could you show me how to implement it in your sample?
I would like to confirm if I understood the question correctly. Both the lookup and the editor's datasource. If so, the sample's editor and lookup have the same source of data which is ds coming from ig.DataSource using OData.
The difference I gather is that the lookup function is called on databound on our end, while the sample calls the lookup function on the grid's definition.
If you have any questions, please let me know as well.
Looking forward to hearing from you
unfortunately the sample is not what I was looking for:
"...so that it uses OData for the data source and the lookup".
In your sample you only use OData for the lookup.
The problem that I described happens when you use OData for both because one data source and the lookup-array have to be filled before the products data source.
Here is the problem /bug that I described:
"... the data source is still empty when the dataBound event is raised.
I can see in the browser's debugging tools that the dataBound event is called even before the JSON is returned and processed."
You only encounter the problem if both data sources use OData.
Could you modify your sample?