iggridupdating - Updating grid cell values as you type

Question

I'm using Infragistics' igGrid to handle data on my company's web application. We want to use the grid as an "editable grid" for user data interaction (add/edit/delete/view records).

The scenario I want to play out is for when the user inputs a valid item name into a one cell in a new row, the next cell automatically gets populated with the corresponding description of that item. So far I'm unable to make it update automatically.

Answer 1

I believe that the official "Editing Combo Editor" sample will give you the answer you're looking for :)

As noted in its description, changing the "Product Name" column auto-fills the "Price" column. NB: You will need to select a "Category name" first though

There are 2 steps that you need to implement in order to get the desired outcome:

1. Hook to the igCombo's "Selection Changed" event in the context of the igGrid, since igCombo instances will be children to the igGrid's DOM:

   $(document).delegate("#grid1", "iggridrendered", function (evt, ui) {
   var updating = $("#grid1").data("igGridUpdating");
   var editor = updating.editorForKey("ProductID");
   if (editor) {
       $(document).delegate("#comboProductID", "igcomboselectionchanged", comboSelectionChanged);
   }
   else {
       var colSettings = updating.options.columnSettings;
       colSettings[2].editorOptions.selectionChanged = comboSelectionChanged;
   }});
   

2. Write up an event handler that will update the editor field for the desired column (Price in this case):

   function comboSelectionChanged(evt, ui) { var items = ui.items || []; if (items.length === 1) { var item = items[0]; var editor = $("#grid1").igGridUpdating("editorForKey", "Price"); $(editor).igEditor("value", products[item.index].Price); } }

The steps are taken from the HTML code view of the Sample (just below the grid). If you want to have a better look at that code view snippet, I've placed it in a stand-alone JSFiddle here: http://jsfiddle.net/BorislavTraykov/4uJBD/

If the solution doesn't work out for you, please elaborate some more on the scenario you are aiming to accomplish.