Enabling editing of a cell based on other cell value dynamically.

Hi Guys,

I have an ig-grid with 10 columns in which 5 columns are editable and 5 are read only. I’m handling this via editCellStarting.

Among the editable columns is a dropdown/igcombo and upon the option selected from the dropdown, I need to enable the editing for one of the columns which was earlier read-only/disabled. I have the selectionChanged event of the igcombo but not sure how I can get the cell to be editable.

I tried the following but it’s not working. It throws an error saying an edit is already in progress.

$('#grid1').igGridUpdating('startEdit', 1, 1); 

Appreciate your help.

Thanks,

Shahrukh

Hello Shahrukh,

Thank you for posting in out community.

In order to ensure that I will provide you with the most accurate support I will need some additional information regarding your scenario. Can you please answer the following questions:

• What is your edit mode, is it "row", "cell" or "dialog"?
• What is the condition that you check in the editCellStarting event? Is it just the column key or you are checking for some of the other cell values? For example:

                      editCellStarting: function(evt, ui){
                            if(ui.columnKey == "FirstName" || ui.columnKey == "LastName") {
                                   return false;
                             }
                      }

                   or

                 editCellStarting: function(evt, ui){
                            if(ui.columnKey == "FirstName" && [other_cell_value] === 5) {
                                   return false;
                             }
                  }

• Would you like to just set this column as editable for future edits or you would like to end edit mode for the current column and enter edit mode for the column that you have just enabled for editing?

This information is going to be highly appreciated and will help me decide how we should proceed further.

Looking forward to hearing from you.

Hi Vasya,

My edit mode is Row. I am checking the column key condition in the editCellStarting. I would like to end edit mode for the current column and enter the edit mode for the column which would be enabled.

Thanks for your quick response.

Hello Shahrukh,

Thank you for answering my questions.

What I can suggest for achieving your re`uirement is handling selectionChanged event of the igCombo editor provider. Every time the selection is changed edit mode can be ended using endEdit method (with autoCommit option set to true the newly selected value will be committed) and afterwards entered again conditionally for the column of your choice. When trying to enter edit mode, using startEdit method this will trigger  the editCellStarting event. There you can check the value of the column with the combo editor and based on this value decide whether it will be read only or editable. Ending edit mode is necessary because when row is in already edit mode calling startEdit will cause an exception.

For example:

                    {
                        name: "Updating",
						columnSettings: [
							 {
								columnKey : "City",
								editorType: "combo",
								editorOptions: {
									dataSource: cities,
									textKey: "name",
									valueKey: "name",
									selectionChanged: function(evt, ui){
									var rowID = parseInt( ui.owner.element.closest("tr").attr("data-id"));
												$("#grid").igGridUpdating("endEdit", true);
												$("#grid").igGridUpdating("startEdit", rowID, "FirstName", true); 
									}
								}
							}
						],
					
						editCellStarting: function(evt, ui){
							cellToCompareVal = ui.owner.grid.getCellValue(ui.rowID, "City");
							if(ui.columnKey == "FirstName" && cellToCompareVal !== "Sofia" ) {
								return false;
							}
						}
                    },

Attached you will find a sample illustrating my suggestion for your reference. The “City” column has a combo editor with two values – “Sofia” and “Plovdiv”. If “Sofia is selected the “First Name” column is going to be editable. In all other cases this column is going to be read only.

Please test my sample on your side and let me know if you have any additional questions regarding this matter.

Attachments:

1. 4863.igGridConditionalEditing.zip

This works in my scenario Vasya.

Appreciate your help. 

Cheers.

Hello,

I am glad that you find my suggestion helpful.

Thank you for using Infragistics components.

Thank you!