Skip to content

Cascading dropdown JavaScript generation

This operation builds the JavaScript block that Infragistics invokes client-side when a Column2 grid cell enters edit mode, filtering that cell's available options to only those matching the row's Column1 selection.

Field Value
Operation ID OP-DROPDOWN-GENJS
Trigger Called from within Cascading dropdown data bind (same class)
Inputs Populated l1/l2 collections, Column1.Key, Column2.Key
Outputs A JavaScript string registered as the "DD" client script block
Primary components clsDropDownController.GenerateJavaScript
Entry point SAIF.Presentation.Web.Controls.Infragistics103\clsDropDownController.vb

Steps

  1. Emit a <script> block defining function BeforeEdit{Column2.Key}(gridName, cellId).
  2. Inside the function: resolve the grid column and row via Infragistics client APIs igtbl_getColumnById/igtbl_getRowById.
  3. If col.Key does not equal Column2.Key: return immediately (guard clause — the function is reused across cells but only acts on the matching column).
  4. Read the current value of the Column1-keyed cell in the same row (catCell).
  5. Build a JS switch(catCell) statement: for each l1 item (a distinct Column1 value), emit a case that constructs a filtered vListFilter array containing only the l2 items whose key (case-insensitively) matches that l1 item's id (BR-5).
  6. Assign the filtered array to col.ValueList, replacing the grid column's dropdown options with the subset relevant to the selected Column1 value.

This implements the client-side business behavior of a dependent/cascading dropdown inside an Infragistics UltraWebGrid cell; the matching logic ("key equals id") is a UI filtering convention, not a documented business rule with a separate server-side enforcement point.

Process flow

The following diagram visualizes this operation's control flow.

flowchart TD
    Start([BeforeEdit function invoked client-side]) --> Resolve[Resolve col and row via igtbl_getColumnById/igtbl_getRowById]
    Resolve --> Guard{col.Key equals Column2.Key?}
    Guard -->|No| EndSkip([Return - not the target column])
    Guard -->|Yes| ReadCat[Read Column1-keyed cell value catCell]
    ReadCat --> Switch[switch on catCell: build filtered vListFilter per l1 item]
    Switch --> Assign[Assign vListFilter to col.ValueList]
    Assign --> EndOk([Filtered options shown in grid cell])

Failure and edge-case behavior

  • Guard clause: if the resolved column's key does not match Column2.Key, the function returns without modifying the value list — this allows one generated function to be safely wired for reuse across cells.

Sources

  • SAIF.Presentation.Web.Controls.Infragistics103\clsDropDownController.vb