123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133 |
- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
- <html>
- <head>
- <title>Dijit Grid</title>
- <script type="text/javascript">
- var djConfig = {isDebug: true, debugAtAllCosts: true};
- </script>
- <style type="text/css">
- @import "../../dojo/resources/dojo.css";
- @import "css/dijitTests.css";
- </style>
- <script type="text/javascript" src="../../dojo/dojo.js"></script>
- <script type="text/javascript" src="_testCommon.js"></script>
- <style type="text/css">
- body{ padding:1em 3em; }
- /* The following will end up being added by code. */
- .dijitGridColumn1{ width:60px; }
- .dijitGridColumn2{ width:100px; }
- .dijitGridColumn3{ width:100px; }
- .dijitGridColumn4{ width:280px; }
- /* End code add */
- div.clear { clear:both; }
- div.dijitGrid {
- width:600px;
- border:1px solid #ccc;
- margin:1em;
- }
- table td {
- border:1px solid #ccc;
- border-collapse:none;
- }
- div.digitGridRow {
- border:1px solid #c00;
- clear:both;
- }
- span.dijitGridCell{
- padding:0.25em;
- display:block;
- float:left;
- }
- span.dijitGridSeparator{
- display:block;
- float:left;
- width:1px;
- border-left:1px solid #ccc;
- }
- div.dijitGridHead {
- background-color:#efefef;
- border-bottom:1px solid #ccc;
- font-weight:bold;
- }
- div.dijitGridBody {
- height:200px;
- overflow:auto;
- }
- div.dijitGridBodyContent {
- overflow:visible;
- }
- div.dijitGridFoot { }
- </style>
- </head>
- <body>
- <h1>Dijit Grid: Table Test</h1>
- <p>This is a pure HTML test, in order to develop the eventual markup structure for the Dijit Grid. It is <strong>not</strong> a working Grid, nor will it be the eventual Grid test.</p>
- <div class="dijitGrid">
- <div class="dijitGridHead">
- <div class="dijitGridRow">
- <span class="dijitGridCell dijitGridColumn1">Name</span>
- <span class="dijitGridSeparator"></span>
- <span class="dijitGridCell dijitGridColumn2">Date Added</span>
- <span class="dijitGridSeparator"></span>
- <span class="dijitGridCell dijitGridColumn3">Date Modified</span>
- <span class="dijitGridSeparator"></span>
- <span class="dijitGridCell dijitGridColumn4">Label</span>
- <div class="clear"></div>
- </div>
- </div>
- <div class="dijitGridBody">
- <div class="dijitGridBodyContent">
- <table cellpadding="0" cellspacing="0" border="0" width="576" style="margin:0;border:0;">
- <colgroup>
- <col width="60"/>
- <col width="100"/>
- <col width="100"/>
- <col width="280"/>
- </colgroup>
- <tr><td>Adam</td><td>3/1/2004</td><td>11/1/2003</td><td><p><strong>Lorem ipsum</strong> dolor sit amet...</p><div>consectetuer</div></td></tr>
- <tr><td>Betty</td><td>6/15/2005</td><td>1/7/2006</td><td>Adipiscing elit, sed diam nonummy nibh euismod</td></tr>
- <tr><td>Carla</td><td>4/23/2002</td><td>3/1/2004</td><td>tincidunt ut laoreet dolore magna aliquam erat volutpat.</td></tr>
- <tr><td>David</td><td>11/1/2003</td><td>6/15/2005</td><td>Ut wisi enim ad minim veniam, quis</td></tr>
- <tr><td>Esther</td><td>1/7/2006</td><td>4/23/2002</td><td>nostrud exerci tation ullamcorper</td></tr>
- <tr><td>Fred</td><td>3/1/2004</td><td>11/1/2003</td><td>suscipit lobortis nisl ut aliquip ex ea commodo consequat.</td></tr>
- <tr><td>Greg</td><td>6/15/2005</td><td>1/7/2006</td><td><p><strong>Lorem ipsum</strong> dolor sit amet...</p><div>consectetuer</div></td></tr>
- <tr><td>Helga</td><td>4/23/2002</td><td>3/1/2004</td><td>adipiscing elit, sed diam nonummy nibh euismod</td></tr>
- <tr><td>Ianna</td><td>11/1/2003</td><td>6/15/2005</td><td>tincidunt ut laoreet dolore magna aliquam erat volutpat.</td></tr>
- <tr><td>Jane</td><td>1/7/2006</td><td>4/23/2002</td><td>Ut wisi enim ad minim veniam, quis</td></tr>
- </table>
- </div>
- </div>
- <div class="dijitGridFoot">
- </div>
- </div>
- <h2>A regular table, for comparison purposes</h2>
- <table cellpadding="0" cellspacing="0" border="0" width="600">
- <thead>
- <tr>
- <th width="60" valign="top">Name</th>
- <th width="100" align="center" valign="top">Date Added</th>
- <th width="100" align="center" valign="top">Date Modified</th>
- <th>Label</th>
- </tr>
- </thead>
- <tbody>
- <tr><td>Adam</td><td>3/1/2004</td><td>11/1/2003</td><td><p><strong>Lorem ipsum</strong> dolor sit amet...</p><div>consectetuer</div></td></tr>
- <tr><td>Betty</td><td>6/15/2005</td><td>1/7/2006</td><td>Adipiscing elit, sed diam nonummy nibh euismod</td></tr>
- <tr><td>Carla</td><td>4/23/2002</td><td>3/1/2004</td><td>tincidunt ut laoreet dolore magna aliquam erat volutpat.</td></tr>
- <tr><td>David</td><td>11/1/2003</td><td>6/15/2005</td><td>Ut wisi enim ad minim veniam, quis</td></tr>
- <tr><td>Esther</td><td>1/7/2006</td><td>4/23/2002</td><td>nostrud exerci tation ullamcorper</td></tr>
- <tr><td>Fred</td><td>3/1/2004</td><td>11/1/2003</td><td>suscipit lobortis nisl ut aliquip ex ea commodo consequat.</td></tr>
- <tr><td>Greg</td><td>6/15/2005</td><td>1/7/2006</td><td><p><strong>Lorem ipsum</strong> dolor sit amet...</p><div>consectetuer</div></td></tr>
- <tr><td>Helga</td><td>4/23/2002</td><td>3/1/2004</td><td>adipiscing elit, sed diam nonummy nibh euismod</td></tr>
- <tr><td>Ianna</td><td>11/1/2003</td><td>6/15/2005</td><td>tincidunt ut laoreet dolore magna aliquam erat volutpat.</td></tr>
- <tr><td>Jane</td><td>1/7/2006</td><td>4/23/2002</td><td>Ut wisi enim ad minim veniam, quis</td></tr>
- </tbody>
- </table>
- </body>
- </html>
|