HTML contents from Components in React doesn't show in Layout

Suite and Optimus Suite 6
#1

Hello,

I am using the collapsible layout of DHTMLX Suite.
I managed to create the UI in the sample (with empty HTML).

Now I am trying to insert the components i made as its html content.
But it is not showing.

Below is a snippet of my initialization of the layout.

let { css } = this.props
  this.layout = new LayoutDHX(this.el, {
    css: css,
    rows: [
      {
        id: "diagram-content",
        header: "Bin Diagram",
        collapsable: true,
        css: "dhx_layout-cell--border_bottom",
        gravity: false,
        height: "80px"
      },
      {
        cols: [
          {
            id: "todolist-content",
            header: "To Do List",
            collapsable: true,
            gravity: false,
            css: "dhx_layout-cell--border_right",
            width: "200px",
            html: "<ToDoList />"
          },
          {
            rows: [
              {
                id: "calendar-content",
                css: "tasks-container",
                header: "Calendar",
                html: "<EventList />"
              }
            ]
          },
          {
            id: "binlist-content",
            header: "Bin List",
            collapsable: true,
            gravity: false,
            css: "dhx_layout-cell--border_left",
            width: "200px",
            html: "<BinList />"
          },
        ]
      },
      {
        id: "planner-content",
        header: "Planner",
        collapsable: true,
        css: "dhx_layout-cell--border_top",
        gravity: false,
        height: "80px"
      }
    ]
  });
#2

I apologize for the delay with the reply.
Unfortuantely all I can suggest is to avoid using the dhtmlxLayout in the React application for the components positioning and replace it with the native flexible solutions.

1 Like