Check documentation for the latest version of dhtmlxSuite Dynamic Loading DHTMLX Docs

Dynamic Loading


Dynamic Loading mode allows loading data partially, not all at once, by a client-side request. It decreases initial loading time and loading of the server.

To work correctly, the related mode should be enabled on the client side:

  • grid - smart rendering and paging modes
  • treegrid - dynamic branch loading mode
  • tree - dynamic branch loading mode
  • combo - partial autocomplete (you don't need it for normal autocomplete)
  • dataview - dynamiс scrolling or dynamic paging

To activate the mode you should use the method dynamic_loading():

<cfset conn.dynamic_loading(100)>


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

In the 'dynamic loading' mode you can't use GROUP BY within SQL query

Tree/TreeGrid specific

Normally, the connector makes all operations automatically and doesn't need customization.

But in case of the dynamic loading into Tree/TreeGrid, a database can contain a field indicating if the current item is a branch or a leaf. In the beforeRender event handler you are allowed to mark an item as a leaf or a branch (it decreases the number of SQL queries and increases the performance).

<cffunction name="custom_define">
    <cfargument name="item">
    <cfif ARGUMENTS.item.get_value("is_a_branch")>
        <cfset data.set_kids(0)>
        <cfset data.set_kids(1)>    
<cfset tree.event.attach("beforeRender",custom_define)>

The same approach can be used for the non-dynamic mode of tree/treeGrid as well. It's not obligatory but lets you increase data generation performance.

Related samples:

  • 01_basic_connector.cfm - 1.72s - default loading
  • 01p_basic connector.cfm - 0.344s - with custom code for kids flag setting
Back to top