EasyUI Forum

I cannot seem to get datagrid to work in a Wordpress content page. The datagrid which appears on the page is just a blank panel header with an empty content area.

I am using the basic "Create datagrid from an existing table element, defining columns, rows, and data in html" example in the datagrid documentation, i.e. the three column "code, name, price" table example with both thead and tbody content explifitly declared in html. I have enqueued the required easyui css and javascript links and they load correctly in the browsed page. Additionally, other easyui plugins (e.g. tooltip, layout, accordion, tabs, etc.) function as expected when embedded in other page content in the same Wordpress site.

Careful examination of the page with embedded datagrid in chrome developer tools reveals no javascript errors and the easyui elements (i.e. the "panel datagrid" div and its descendants) are configured but the datagrid-view1 and datagrid-view2 table  cell elements are empty.

Am I overlooking  something about using datagrid in Wordpress?

Further examination indicates that a problem is occurring somewhere in the element width javascript calculations. the .datagrid-view2 div gets assigned zero width, so nothing but the panel header and empty content panel gets displayed. I can generate a display of the datagrid table by overriding the assigned .datagrid-view2 div width in css, i.e. with the css !important rule, but other widths get mangled in the process.

Apparently, there is some conflict between Wordpress css or javascript and the easyui counterparts but I cannot sort out what it is. If anyone with knwoledge about easyui datagrid element width calculations can suggest something, I would greatly appreciate it. Thanks.