DHTMLX Docs & Samples Explorer

Dynamical Loading

Dynamical Loading mode allows to load data not all at once, but partially, by client side request ( which decrease initial loading time and decrease loading of server )

  • grid - smart rendering and paging modes
  • treegrid - dynamic branch loading mode
  • tree - dynamic branch loading mode
  • combo - partial autocomplete ( you need not it for normal autocomplete)
        conn.dynamic_loading(true); //tree | treegrid
//or
        conn.dynamic_loading(50); //combo | grid

The parameter(s) are:

  • true|false for tree or treegrid
  • number of rows which should be initially loaded (the value should be more than number of rows visible in grid, or at least any positive number) for grid.
  • maximum number of options which server will send to combo in autocomplete mode for single data request

To work correctly, related mode need to be enabled on client side as well ( for grid - smart rendring | paging enabled, for tree|treegrid - dynamical loading enabled, for combo - autocomplete enabled )

Control of dyn. loading for Tree and TreeGrid

Normally connector make all operations automatically, and need not customization. But in case of dyn. loading in Tree || TreeGrid it possible that DB already have field which shows is current item leaf or branch. By using beforeRender event it possible to mark item as leaf and through that decrease count of SQL queries generated by component ( which means increase in performance )

        class ChildBehavior extends ConnectorBehavior{
            public void beforeRender(DataItem data){
                  if (data.get_value("is_a_branch").equals("1"))
                         data.set_kids(1);
                  else
                         data.set_kids(0);
            }
        }
	tree.event.attach(new ChildBehavior());

The same approach can be used for non-dynamical mode of Tree|TreeGrid as well. It not so necessary , but will increase data generation performance as well.