I have different arrays bound to the combo on each data row. This is in continuation with sample provided in
http://www.infragistics.com/community/forums/t/92694.aspx
I have an igGrid (2013.2 version) with virtualization set to true and mode as continuous. The grid has Updating feature with cell mode editing enabled.
Hello Anitha,
1) Please note that the combo is available only when you enter edit mode of a cell. This means you should get the value of the grid's cell rather than the selected value in the combo. So you can use the getCellValue method as follows:
$("#grdCriteria").igGrid("getCellValue", rowID,"SearchField");
You can see the sample attached ( I have used the same sample from the other thread for consistency). On button click event the value of the SearchField on the first row is taken and wriitten into a text box. However you can go thorugh all rows and all columns with a for loop and get all cells' value.
2) You can use the NullText property of the combo to display as blank like this:
nullText: " " // empty string
" I need to make the default value to set to the first value if array length is 1 " - please clarify at that time would you like to do this - is oit when you open the dropdown ?
Looking forward to hearing from you.
Hi Hristo,
Thanks for the immediate response.
Regarding GetCellValue : Can you please share the sample where you are looping through the all grid rows to get the cell value, I was using the below code snippet to update all values in my grid
var subGroupInfo; subGroupInfo = _$subgroupGrid.data('igGrid').dataSource.dataView();// Update subGroupInfo object as required
// Rebind subGroupInfo back.
In this method, I am able to get the array of values in a combo but I am not able to find the selected value. Is there a better way to do this?
2. Regarding null text query, I need to display either the selected value or blank on click of dropdown.
Regards,
Anitha
I am having similar issues with setting value from the array in combo to multiple rows on button click.
Can you please suggest a solution for the same along with the above 2 queries.
Thanks,
Please find answers to your questions below:
1) I have modified the sample in order to demonstrate how you can loop through every cell in the grid on button click. Every cell's value is then pushed into an array and the elements of the array are then printed in the text area (just to see it works).
for (i = 0; i < gridRows.length; i++) { var rowID = $("#grdCriteria").igGrid("rows")[i].getAttribute("data-id");
for (t = 0; t < gridCols.length; t++) { var colKey = gridCols[t].key; var cellValue = $("#grdCriteria").igGrid("getCellValue", rowID, colKey); cellsValues.push(cellValue); // adding every value to the array }}
$("#txtarea1").val(cellsValues); // writing the elements of the array to the text box
I have also removed every unnecessary code from the sample so now it is much more readable.
- http://help.infragistics.com/jQuery/2014.2/ui.igcombo
3) You should use the setCellValue of igGridUpdating
I hope this helps.
Hello,
I'm just following up to see if you need any further assistance with this issue. If so please let me know.
I don't mean to jump on your thread but I have very close to the same issue. I'm using
$("#age_range").igGrid({ dataSource: data.age_range, autoGenerateColumns: false, primaryKey: "PK", autoCommit: true, width: "100%", height: "90px", columns: [ { headerText: "PK", key: "PK", dataType: "string", hidden: true }, { headerText: "COLLECTION", key: "DBID", dataType: "string", width: "15%", editorOptions: { readOnly: true } }, { headerText: "SITE CODE", key: "SITE_CODE", dataType: "string", width: "15%", editorOptions: { readOnly: true } }, { headerText: "MIN AGE", key: "MIN_AGE", dataType: "string", width: "30%"}, { headerText: "MAX AGE", key: "MAX_AGE", dataType: "string", width: "40%"} ], features: [ { name: 'Updating', enableAddRow: false, enableDeleteRow: false, showDoneCancelButtons: false, editCellStarting: function (evt, ui) { // Test for condition on which to cancel cell editing // Here I use columnIndex property. This will disable from editing the first column in the grid. if (ui.columnIndex === 0 || ui.columnIndex === 1) // cancel the editing return false; }, columnSettings: [{ //The combo is defined as an editor provider. Combo options are defined under 'editorOptions'. columnKey: "MIN_AGE", editorType: 'combo', required: true, editorOptions: { mode: "dropdown", dataSource: ageArray } }, { //The combo is defined as an editor provider. Combo options are defined under 'editorOptions'. columnKey: "MAX_AGE", editorType: 'combo', required: true, editorOptions: { mode: "dropdown", dataSource: ageArray //textKey: "Name", //valueKey: "ID" } } ] } ]And then I'm using you code to find the value of the
$grid = $("#age_range"); var firstRowId = $grid.igGrid("rows")[0].getAttribute("data-id"); var cellValue = $grid.igGrid("getCellValue", firstRowId, "MIN_AGE");
But the only thing I get is what the dropdown was originally set to. I've looked at your example and see what you are doing but can't figure out what I'm missing to get the new value of the dropdown. Is there some feature or value that I need to add?
Thanks
Hello William,
Your code seems fine. However after changing the selected item in the combo you need to lose focus on the cell so that the new value will be committed. If you just change the value and immediately call
var cellValue = $grid.igGrid("getCellValue", firstRowId, "MIN_AGE");
you will receive the old value for sure.