Can I add different options for each row cell？for example, column 1 row 1 has options

Different select options for each row? about editablegrid HOT 2 OPEN

alexwenbj commented on August 15, 2024

Different select options for each row?

from editablegrid.

Comments (2)

crivadavi commented on August 15, 2024

Sure, in the function initializeGrid supposing that your column name is '"color" you can set an EnumProvider with a new function to set the select values as a function of the row.

EditableGrid.prototype.initializeGrid = function() {
   this.setEnumProvider("color", new EnumProvider({ 
        
      // the function getOptionValuesForEdit is called each time the cell is edited
      // here we do only client-side processing, but you could use Ajax here to talk with your server
     // if you do, then don't forget to use Ajax in synchronous mode 
     getOptionValuesForEdit: function (grid, column, rowIndex) {	         
           if (rowIndex == 4) return { "bl" : "Blue", "rd": "Red", "yl" : "Yellow" };
           else if (rowIndex == 5) return { "or" : "Orange", "wh": "White", "bk" : "Black" };
           return null;
           
           // or write whatever is your logic depending on the row
      }
    }));
}

from editablegrid.

alexwenbj commented on August 15, 2024

Thank you .But my options are pull from the server side, return with the data.
My workaround is to custom the setCellRender() function:

this.setCellRenderer("charge_id", new CellRenderer({render: function(cell, value) {
 var str = "<select name='charge_id' class='form-control' onchange='JavaScript:test(this);'><option value='-1'>--Select Something--</option>";
  $.each(value, function( idx, vl ) {
  str += "<option value='"+idx+"'>"+vl+"</option>";
  });
  str +="</select>";
  cell.innerHTML = str;
 }}));

from editablegrid.

Recommend Projects