DHTMLX Docs & Samples Explorer

Attaching custom code to events

The grid provides a rich set of events, you can attach any kind of custom code to them using the following syntax:

  grid.attachEvent(eventName, code);

For example:

  function myHandler(id) { alert(id); }
  grid.attachEvent("onRowSelect",myHandler);

Or simpler syntax:

  grid.attachEvent("onRowSelect",function(id){
      alert(id);
  });

You can attach multiple handlers to one and the same event:

  grid.attachEvent("onRowSelect",myHandler);
  grid.attachEvent("onRowSelect",myHandler2);

In case of row selection both attached functions will be called.

If it is necessary, the custom code can be detached from an event:

  var id1=grid.attachEvent("onRowSelect",myHandler);
  var id2=grid.attachEvent("onRowSelect",myHandler2);
  grid.detachEvent(id2);    // detach myHandler2 from onRowSelect event

Some of the events can be blocked. So based on the return value, the grid will react differently:

  • return “true”; - confirm action
  • return “false”; - deny action
  • no return command - treated as return “false”
  grid.attachEvent("onEditCell",function(){
      return false;     // will block any edit operation
  })