Hello,
I'm currently working with igGrid and having difficult figuring out how to do something.
I have a cell in my grid setup as a comboBox called "JobID". I also have another column in my grid called "JobKey".
The valueKey of the JobID combo is JobKey. If the user is entering a new row of editing a row, I want the JobKey column to update to display the correct one.
So how do I set the JobKey cell in this row the same as the valueKey of my in-Grid combo's valueKey?
This i've been tinkering around with selectionChange, but never got it working. This was my closest attempt.
{
columnKey: 'JobID',editorType: 'combo',editorOptions:
{ loadOnDemandSettings: { enabled: true, pageSize: 25 }, responseDataKey: "value", dataSource: jobDS, filteringType: "remote", textKey: "JobID", valueKey: "JobKey", virtualization: true, autoComplete: true, itemTemplate: "<div>${JobID} - ${JobName}</div>", nullText: "", headerTemplate: "<div class='dropDownHeaderFooter'>Select a Job</div>", footerTemplate: "<div class='dropDownHeaderFooter'></div>", filterExprUrlKey: 'startsWith', mode: 'editable', selectionChanged: function (evt, ui) { $("#gridReservations").igGridUpdating("setCellValue", //getrowID?, 'JobKey', //valueKey??); }
}
};
(sorry for poor indentation)
Thanks,
Julie
Hello Julie,
Thank you for contacting Infragistics Support!
It's not clear enough what you are trying to achieve. Please review the attached sample and let me know if this is the desired behavior.
If not can you please modify the sample, so that it reproduces the issue. Looking forward to your answer!
Sorry about the misunderstanding. The code does not work, but I've edited it closer to what I'm trying to achieve and took some screen shots to help explain.
So I added a column called NameKey and changes Name to be a drop down with textKey: "Name" and valueKey: "NameKey".
So in screenshot s1 I provided, the user selects "Pink Lemonade" in the Name column, which then the NameKey column is automatically updated to the corresponding NameKey for "Pink Lemonade". Something like setting the cell to $(".selector").igCombo("option", "valueKey"); but using a combo that is in the grid (the Name column).
$(
".selector"
).igCombo(
"option"
,
"valueKey"
);
I provided a second screen shot s2, where the user chooses "Vint Soda" and The NameKey column is changed to "157" ...VintSoda's value key.
I hope this helps clear up what I mean.
We are currently looking into this matter and will keep you posted of any available information.Please do not hesitate to contact us with any updates or additional questions regarding this scenario in the meantime.
I modified the attached sample, so that on selectionChanged event we set the value of the NameKey column to corresponding item,
chosen from the comboBox in the Name column:
selectionChanged: function (evt, ui) { var value = ui.items[0].value; $("#grid").igGridUpdating("setCellValue", currentlyUpdatingRowID, "NameKey", value);
Please refer to the new sample and let me know if this is the desired behavior.
I think this would work, however was I played around with my the issue I noticed the "selectionChanged" event is firing too soon. I am unsure of the reason. I am using a Load-on -demand combobox using a remote datasource. It seems to be entering the event with the old information. If I use DropDownClosed it works fine, however that event does not have ui.items as an option. So not sure what to do.
Thank you for the detailed response.
About your questions, what do you mean by saying "event is firing too soon and provide old information", when you change the selected item its returning you the previous selected item and not the current?
Could you please isolate a small sample that is using your remote data source in order to observe the issue.
Looking forward to hearing from you.
Hello!
I am unsure of what has happened between today and the the day we previously talked, but everything seems to be working great now!
Thanks for your help!
If the userGroupName column is also editable, which I believe is the case (otherwise setCellValue would end your edit mode), what I can suggest is to get the editor for it and update its value as shown in the following fiddle: https://jsfiddle.net/hLfsv8th/
I hope this helps! Please, let me know if you have any other issues or questions!
Best regards,
Stamen Stoychev
In my scenario when i am adding new row with a combo in it whenever i change the selection i would like to bind that selected value from "usergroup" to another text column named "displayName". for existing row edit this below code works for me in comboeditor options.
selectionChanged: function (evt, ui) {var value = ui.items[0].data.userGroupName;;if(currentlyUpdatingRowID!==-1)$("#userGroupManagementGrid").igGridUpdating("setCellValue", currentlyUpdatingRowID, "userGroupName", value);}
thank you for your feedback!
If you need additional assistance regarding this topic, please don't hesitate to ask.