Opened 12 years ago
Closed 11 years ago
#10899 closed defect (invalid)
Grid fails to display data when table is surrounded by div tags
Reported by: | fphan | Owned by: | Bryan Forbes |
---|---|---|---|
Priority: | high | Milestone: | 1.6 |
Component: | DojoX Grid | Version: | 1.4.2 |
Keywords: | grid EnhancedGrid | Cc: | |
Blocked By: | Blocking: |
Description
The below code will only display the header row unless the div tags are removed:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <link rel="stylesheet" type="text/css" href="../js/dijit/themes/tundra/tundra.css"/> <style type="text/css"> body, html { font-family:helvetica,arial,sans-serif; font-size:90%; } </style> <style type="text/css"> /* @import "../js/dojox/grid/resources/Grid.css"; */ @import "../js/dijit/themes/tundra/tundra.css"; @import "../js/dojox/grid/enhanced/resources/tundraEnhancedGrid.css"; /* @import "../js/dojox/grid/enhanced/resources/EnhancedGrid_rtl.css"; */ /* @import "../../_static/dojoGrid.css"; */ .dojoxGrid table { margin: 0; } html, body { width: 100%; height: 100%; margin: 0; } </style> </head> <body class=" tundra "> <div> <span dojoType="dojox.data.CsvStore" jsId="store1" url="../js/dojox/grid/tests/support/movies.csv"> </span> <table id="grid" dojoType="dojox.grid.EnhancedGrid" store="store1" query="{ Title: '*' }" clientSort="true" style="width: 100%; height: 100%;" rowSelector="20px" plugins="{nestedSorting: true, dnd: true, indirectSelection: false, // Each required feature must be turned on /* menus:{ headerMenu:'headerMenu', //References menus defined declaratively below rowMenu:'rowMenu', cellMenu:'cellMenu', selectedRegionMenu:'selectedRegionMenu' } */ }" > <thead> <tr> <th width="300px" field="Title"> Title of Movie </th> <th width="50px" field="Year"> Year </th> <th width="200px" field="Producer"> Producer </th> </tr> </thead> </table> </div </body> <script type="text/javascript" src="../js/dojo/dojo.js" djConfig="parseOnLoad: true"></script> <script type="text/javascript"> // dojo.require("dojox.grid.DataGrid"); dojo.require("dojox.data.CsvStore"); dojo.require("dojox.grid.cells.dijit"); // Required for all Enhanced features dojo.require("dojox.grid.EnhancedGrid"); // Row/Column drag-drop feature dojo.require("dojox.grid.enhanced.plugins.DnD"); // Declarative pop-up menu feature dojo.require("dojox.grid.enhanced.plugins.Menu"); // Nested sorting feature dojo.require("dojox.grid.enhanced.plugins.NestedSorting"); // Indirect selection(check box/radio button selection) feature dojo.require("dojox.grid.enhanced.plugins.IndirectSelection"); </script> <!-- NOTE: the following script tag is not intended for usage in real world!! it is part of the CodeGlass and you should just remove it when you use the code --> <script type="text/javascript"> dojo.addOnLoad(function() { if (document.pub) { document.pub(); } }); </script> </html>
Attachments (3)
Change History (6)
Changed 12 years ago by
Attachment: | grid_no_div.PNG added |
---|
Changed 12 years ago by
Attachment: | grid_w_div.PNG added |
---|
Screen shot of table when div tags are used.
Changed 12 years ago by
Attachment: | ff_debugger.PNG added |
---|
Screen shot of Firefox debugger where the link shown, when clicked on, will show that data has been retrieved even though none is displayed.
comment:1 Changed 12 years ago by
Setting the height style for the div solves the problem. The min-height style does not work. This has been painfully frustrating.
comment:2 Changed 12 years ago by
Owner: | changed from bryanforbes to Bryan Forbes |
---|
comment:3 Changed 11 years ago by
Milestone: | tbd → 1.6 |
---|---|
Resolution: | → invalid |
Status: | new → closed |
Closing, in the attached sample code, height/width are missed on the wrapper div.
Note: See
TracTickets for help on using
tickets.
Screen shot of table shows correct rendering of content when no div tags surround the table.