Note that there are some explanatory texts on larger screens.

plurals
  1. PODojo (1.9.1) datagrid does not render if not a direct child of body
    primarykey
    data
    text
    <p>I have problems with rendering a datagrid in my custom widget. </p> <p>I was able to pinpoint the problem to this: datagrids that are not a direct child of the body do do not render correctly.</p> <p>Showcase:</p> <pre class="lang-html prettyprint-override"><code>&lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;title&gt;Problems with datagrid&lt;/title&gt; &lt;meta charset="utf-8"&gt; &lt;link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/dojo/1.9.1/dojo/resources/dojo.css"&gt; &lt;link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/dojo/1.9.1/dijit/themes/claro/claro.css" media="screen"&gt; &lt;link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/dojo/1.9.1/dojox/grid/resources/Grid.css"&gt; &lt;link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/dojo/1.9.1/dojox/grid/resources/claroGrid.css"&gt; &lt;/head&gt; &lt;body class="claro"&gt; &lt;div id="outer"&gt;&amp;nbsp;&lt;/div&gt; &lt;div&gt;&lt;div id="inner"&gt;&amp;nbsp;&lt;/div&gt;&lt;/div&gt; &lt;script&gt; dojoConfig = { isDebug: true, async: true, has: { "dojo-firebug": true, "dojo-debug-messages": true } }; &lt;/script&gt; &lt;script src="//ajax.googleapis.com/ajax/libs/dojo/1.9.1/dojo/dojo.js" data-dojo-config="async: true"&gt;&lt;/script&gt; &lt;script&gt; require([ "dojo/parser", "dojo/ready", "dojo/store/Memory", "dojo/data/ObjectStore", "dojox/grid/DataGrid" ], function(parser, ready, Memory, ObjectStore, DataGrid){ createOuterGrid = function(){ var data = [{id:12,name:'outer'},{id:13,name:'blabla'}]; var dataStore = new ObjectStore({ objectStore:new Memory({ data:data }) }); var grid = new DataGrid({ store:dataStore, items:data, structure:[ {name:"ID", field:"id", width:"20%"}, {name:"Name", field:"name", width:"80%"} ] }, "outer"); grid.startup(); }; createInnerGrid = function(){ var data = [{id:12,name:'inner'},{id:13,name:'blabla'}]; var dataStore = new ObjectStore({ objectStore:new Memory({ data:data }) }); var grid = new DataGrid({ store:dataStore, items:data, structure:[ {name:"ID", field:"id", width:"20%"}, {name:"Name", field:"name", width:"80%"} ] }, "inner"); grid.startup(); }; parser.parse(); ready(function(){ createOuterGrid(); createInnerGrid(); }); }); &lt;/script&gt; &lt;/body&gt; &lt;/html&gt; </code></pre> <p>Is there a way to make this work? Should I log it somewhere ?</p> <p>I originally posted my question here: <a href="https://stackoverflow.com/questions/18350335/dojo-stackcontainer-contains-custom-widget-that-uses-datagrid-but-dategrid-not">dojo stackcontainer contains custom widget that uses datagrid, but dategrid not showing up</a> but then I didn't know that it was caused by the fact that a datagrid should be a direct child of the body.</p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload