DHTMLX Docs & Samples Explorer

Integration with Other Components

Status Bar

The user can add a status bar to any window in dhtmlxWindows with the help of attachStatusBar() method:

    var sb = dhxWins.window(id).attachStatusBar();

When the status bar is added to a window, the user can write any custom text into it using the following methods:

    sb.setText("Some custom text");

There is also the possibility to get the current Status Bar text in the following way:

    var text = sb.getText();

getText() method returns the current Status Bar text.

dhtmlxMenu

A dxtmlxMenu 2.0 can be easily added to any window in the following way:

    dhxWins.window(id).attachMenu();

The method returns dhtmlxMenu 2.0 object, which the user should customize according to his needs.

dhtmlxToolbar

A toolbar can be added to any window in the following way:

    dhxWins.window(id).attachToolbar();

The method returns dhtmlxToolbar 2.0 object, which the user should customize according to his needs.

dhtmlxTree

The user can add a Tree to any window in dhtmlxWindows with the help of attachTree() method:

    dhxWins.window(id).attachTree();

There is only one input parameter for this method. The parameter is the id of a virtual super item that is a parent to all the top level tree nodes of the added dhtmlxTree (see dhtmlxTree constructor description for details). If super root element id is 0, this parameter can be omitted. This method returns dhtmlxTree object, which the user can customize.

dhtmlxGrid

The user can add a Grid to any window in dhtmlxWindows with the help of attachGrid() method:

    dhxWins.window(id).attachGrid();

The method returns dhtmlxGrid object, which the user should customize according to his needs.

Please note if you want to attach dhtmlxGrid with paging to the dhtmlxWindows you should use attachObject() method to attach container with grid and paging area:

   dhxWins.window(id).attachObject("paging_container");

dhtmlxTreeGrid

A TreeGrid can be added to any window in the following way:

    dhxWins.window(id).attachGrid();

The method returns dhtmlxTreeGrid object, which the user should customize according to his needs.

dhtmlxFolders

There is an easy way to add a Folders to any window in the following way:

    dhxWins.window(id).attachFolders();

The method returns dhtmlxFolders object, which the user should customize according to his needs.

dhtmlxTabbar

There is an easy way to add a Tabbar to any window in the following way:

    dhxWins.window(id).attachTabbar();

The method returns dhtmlxTabbar object, which the user should customize according to his needs.

dhtmlxLayout

A Layout can be added to any window this way:

    dhxWins.window(id).attachLayout(pattern, skin);

The parameters of this method are the following:

  • pattern - the code of the Layout's pattern;
  • skin - the name of the chosen skin (optional). If this parameter is not indicated, the Layout will be attached with the default skin (dhx_blue).

The method returns dhtmlxLayout object, which the user should customize according to his needs.

Opening popup windows from dhtmlxLayout

dhtmlxLayout already contain dhxWins object, so in case you already use dhtmlxlayout you can create new windows using this object. See details here

dhtmlxAccordion

A dhtmlxAccordion can be attached to a window like this:

    dhxWins.window(id).attachAccordion();

The method returns dhtmlxAccordion object, which the user should customize according to his needs.

dhtmlxEditor

A dhtmlxEditor can be attached to a window this way:

    dhxWins.window(id).attachEditor();

The method returns dhtmlxEditor object, which the user should customize according to his needs.