What exactly defer do?

Question

I placed scrollIntoView() to make my grid scroll visible. When I add new grid in gridContainer so I using this method. This is working I can check from debugger. my scrollIntoView()

grid.body.dom.scrollIntoView();

But once it reached in defer function it not scrollIntoView() functioning. Can anybody please suggest how to skip this. What defer do and how to skip this. Also I am using grid.focus() and again same thing is happening. Grid is coming into view but after come out from debugger no showing into view.

defer: function(fn, millis, scope, args, appendArgs) {
  fn = Ext.Function.bind(fn, scope, args, appendArgs);
  if (millis > 0) {
    return setTimeout(function() {
      if (Ext.elevateFunction) {
        Ext.elevateFunction(fn);
      } else {
        fn();
      }
    }, millis);
  }
  fn();
  return 0;
},

Answer 1

A workaround would be not to scroll to the component, but to use the card layout for the center container and display the new grid on an other card.

var centerCt;  // reference to your center container
var centerLayout = centerContainer.getLayout();
var newGrid = Ext.create('Ext.grid.Panel', {});
centerCt.add(newGrid);
centerLayout.setActiveItem(newGrid);

I created a Sencha Fiddle.