Canceling an event on a grid

Hi! I posted this question but in an unrelated thread so got no responses.
I have several grids on a page. When a column on ANY grid
is resized I need to force other grids columns to resize to the same size.

I use
grid1.onColumnWidthChanged = function(width, index){setColumnWidth(width, index);

and it works great.

Here’s where the problem is:

since the user can resize a column on any of the grids, other grids also have to implement onColumnWidthChanged event. So, when I resize a column, other grids get this event and try to resize columns on other grids etc etc etc. I am going into an infinite loop which eventually causes the browser to break.

I figured if I can only stop/cancel this event on other grids so I can resize appropriately, and then start listening for this event again I’ll achieve the goal.

Is this the right approach? What else is available? Alex, what do you think?

Many thanks in advance,

I would say the most simple is just to use global flag variable - you check if it is set in the beginning of the event handler and proceed only if it's not.

var insideColumnResize = false;

grid.onColumnWidthChanged = function(width, index){
  if (insideColumnResize) {
    return;
  }
  insideColumnResize = true;
...
  insideColumnResize = false;
}