Opened 13 years ago
Closed 12 years ago
#7683 closed defect (worksforme)
Grid in accordionPane KO
Reported by: | kirlian | Owned by: | Nathan Toone |
---|---|---|---|
Priority: | high | Milestone: | 1.3 |
Component: | DojoX Grid | Version: | 1.2beta |
Keywords: | grid accordionPane | Cc: | |
Blocked By: | Blocking: |
Description
Hello,
when we have a grid in an accordionPane, we get the error : this.headerContentNode.firstChild is null
the source code :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <meta http-equiv="content-type" content="text/html;charset=UTF-8" /> <title>Test Maquette Ecran</title> <!-- Include StyleSheet --> <style type="text/css"> @import "./dojo/resources/dojo.css"; @import "./dijit/themes/tundra/tundra.css"; @import "./dijit/themes/tundra/layout/AccordionContainer.css"; @import "./dojox/grid/resources/Grid.css"; @import "./dojox/grid/resources/tundraGrid.css"; html, body { height: 100%; width: 100%; padding: 0; border: 0; overflow:hidden; } #acStudentLeftMenuPane_id { width: 300px;height: 300px} </style> <script type="text/javascript" src="./dojo/dojo.js" djConfig="parseOnLoad: false"></script> <script type="text/javascript"> dojo.require("dijit.layout.AccordionContainer"); dojo.require("dijit.layout.ContentPane"); dojo.require("dijit.TitlePane"); dojo.require("dijit.layout.TabContainer") dojo.require("dojox.grid.DataGrid") dojo.require("dojo.data.ItemFileWriteStore"); dojo.addOnLoad(function() { var acStudentLeftMenuPane = new dijit.layout.AccordionContainer({ id: "acStudentLeftMenuPane_id" }); //AllStudentListPane var apStudentListPane = new dijit.layout.AccordionPane({ title: "All Students", selected : "true", id: "apStudentListPane_id" }); //Grid var ifrsStudentLeftList = new dojo.data.ItemFileReadStore ({ url :"./100.js" }); var gsStudentLeftList = [{ cells: [[ {name: 'id', width: "40px", field: "id"}, {name: 'name', width: "60px", field: "name"}, {name: 'firstname', width: "60px", field: "firstname"} ] ] }]; var gStudentLeftList = new dojox.grid.DataGrid ({ autoWidth: "true", center:"true", title: "Tous les étudiants", query: { id: '*' }, id: "gStudentLeftList_id", structure: gsStudentLeftList, fitTo: "parent", store:ifrsStudentLeftList, rowsPerPage: 20 }); gStudentLeftList.render(); //StudentListPane2 var apStudentListPane2 = new dijit.layout.AccordionPane({ title: "All Students", selected : "false", id: "apStudentListPane2_id" }); //Startup() document.body.appendChild(acStudentLeftMenuPane.domNode); acStudentLeftMenuPane.addChild(apStudentListPane); apStudentListPane.setContent(gStudentLeftList.domNode); acStudentLeftMenuPane.addChild(apStudentListPane2); acStudentLeftMenuPane.startup() //This line make an error gStudentLeftList.resize() }); </script> </head> <body class="tundra"> </body> </html>
and the json used by the grid
{"items": [{"name": "arnaud", "placeofbirth": "Caen", "id": 107, "firstname": "ALE61"}, {"name": "arnaud", "placeofbirth": "hy", "id": 99, "firstname": "ALE60"}, {"name": "arnaud", "placeofbirth": "TEST97", "id": 97, "firstname": "ALE15"}], "label": "id", "identifier": "id"}
Arnaud
Change History (7)
comment:1 Changed 13 years ago by
Milestone: | 1.2 → 1.3 |
---|
comment:2 Changed 13 years ago by
Hello,
It was possible to add a grid to an accordionPane in 1.1 and in the nightbuild 1.2 of the 28/08/08.
There is the same issu when we add a grid to a contentPane.
It is really difficult to use a grid in a rich user interface if it is not possible to add it at least to a contentPane.
This is an example with the contentPane, the JSON used is the same than in the first example. <code> <!DOCTYPE html PUBLIC "-W3CDTD XHTML 1.0 TransitionalEN"
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html;charset=UTF-8" /> <title>Test Maquette Ecran</title>
<!-- Include StyleSheet? -->
<style type="text/css">
@import "./dojo/resources/dojo.css"; @import "./dijit/themes/tundra/tundra.css";
@import "./dijit/themes/tundra/layout/AccordionContainer.css";
@import "./dojox/grid/resources/Grid.css"; @import "./dojox/grid/resources/tundraGrid.css"; html, body {
height: 100%; width: 100%; padding: 0; border: 0; overflow:hidden;
} #apStudentLeftMenuPane_id {
width: 300px;height: 300px}
</style> <script type="text/javascript"
src="./dojo/dojo.js" djConfig="parseOnLoad: false"></script>
<script type="text/javascript">
dojo.require("dijit.layout.AccordionContainer?"); dojo.require("dijit.layout.ContentPane?"); dojo.require("dijit.TitlePane?"); dojo.require("dijit.layout.TabContainer?") dojo.require("dojox.grid.DataGrid?") dojo.require("dojo.data.ItemFileWriteStore?");
dojo.addOnLoad(function() {
var apStudentListPane = new dijit.layout.ContentPane?({
id: "apStudentListPane_id"
});
Grid
var ifrsStudentLeftList = new dojo.data.ItemFileReadStore? ({
url :"./100.js"
});
var gsStudentLeftList = [{
cells: [[
{name: 'id', width: "40px", field: "id"}, {name: 'name', width: "60px", field: "name"}, {name: 'firstname', width: "60px", field: "firstname"}
]
]
}];
var gStudentLeftList = new dojox.grid.DataGrid? ({
autoWidth: "true", center:"true", title: "Tous les étudiants", query: { id: '*' },
id: "gStudentLeftList_id",
structure: gsStudentLeftList, fitTo: "parent", store:ifrsStudentLeftList, rowsPerPage: 20
});
gStudentLeftList.render();
Startup()
document.body.appendChild(apStudentListPane.domNode);
apStudentListPane.setContent(gStudentLeftList.domNode);
apStudentListPane.startup()
This line make an error gStudentLeftList.resize()
});
</script>
</head> <body class="tundra"> </body>
</html> </code>
comment:3 Changed 13 years ago by
comment:4 Changed 13 years ago by
I nomore do a contentPane.setContent(grid.domNode) but a contentPane.setcontent(grid). I have no errors but the grid doesn't display correctly (the grid is full in grey)
So, I have taken the example given in #7349, I have no error but nothing display in FF3, maybe ok as the grid has no properties.
I add some properties (size, view and store), the grid doesn't display correctly. The page is blank, I get 2 checkbox in left up corner and when I click on the grid, the scroll bar appear.
Just for information, to make a grid works in an accordionPane in 1.1 I have done :
accordionPane.setcontent(grid.domNode) dojo.connect(accordionePane,"resize",grid,"resize")
Arnaud.
comment:5 Changed 13 years ago by
comment:6 Changed 12 years ago by
Owner: | changed from Bryan Forbes to Nathan Toone |
---|
Reassigning to me
comment:7 Changed 12 years ago by
Resolution: | → worksforme |
---|---|
Status: | new → closed |
Please reopen if this issue still exists. Bill put in some changes in the past couple of days which should address this sort of issue.
Looks like a dup of #5673.