[Dojo-checkins] toonetown - r17964 - in dojox/trunk/grid: . tests
dojo-checkins-admin at dojotoolkit.org
dojo-checkins-admin at dojotoolkit.org
Mon Jun 15 13:45:35 EDT 2009
Author: toonetown
Date: Mon Jun 15 10:45:20 2009
New Revision: 17964
Added:
dojox/trunk/grid/tests/test_data_grid_autowidth.html (contents, props changed)
Modified:
dojox/trunk/grid/_Grid.js
dojox/trunk/grid/_View.js
Log:
Fixes #9412 - add in option for initialWidth on a grid !strict
Modified: dojox/trunk/grid/_Grid.js
==============================================================================
--- dojox/trunk/grid/_Grid.js (original)
+++ dojox/trunk/grid/_Grid.js Mon Jun 15 10:45:20 2009
@@ -210,6 +210,14 @@
// autoWidth: Boolean
// If autoWidth is true, grid width is automatically set to fit the data.
autoWidth: false,
+
+ // initialWidth: String
+ // A css string to use to set our initial width (only used if autoWidth
+ // is true). The first rendering of the grid will be this width, any
+ // resizing of columns, etc will result in the grid switching to
+ // autoWidth mode. Note, this width will override any styling in a
+ // stylesheet or directly on the node.
+ initialWidth: "",
// autoHeight: Boolean|Integer
// If autoHeight is true, grid height is automatically set to fit the data.
@@ -359,6 +367,10 @@
this._setHeaderMenuAttr(this.headerMenu);
this._setStructureAttr(this.structure);
this._click = [];
+ this.inherited(arguments)
+ if(this.domNode && this.autoWidth && this.initialWidth){
+ this.domNode.style.width = this.initialWidth;
+ }
},
destroy: function(){
@@ -736,11 +748,13 @@
adaptWidth: function() {
// private: sets width and position for views and update grid width if necessary
- var w = this.autoWidth ? 0 : this.domNode.clientWidth || (this.domNode.offsetWidth - this._getPadBorder().w),
+ var doAutoWidth = (!this.initialWidth && this.autoWidth);
+ var w = doAutoWidth ? 0 : this.domNode.clientWidth || (this.domNode.offsetWidth - this._getPadBorder().w),
vw = this.views.arrange(1, w);
this.views.onEach("adaptWidth");
- if (this.autoWidth)
+ if(doAutoWidth){
this.domNode.style.width = vw + "px";
+ }
},
adaptHeight: function(inHeaderHeight){
Modified: dojox/trunk/grid/_View.js
==============================================================================
--- dojox/trunk/grid/_View.js (original)
+++ dojox/trunk/grid/_View.js Mon Jun 15 10:45:20 2009
@@ -495,6 +495,7 @@
convertColPctToFixed: function(){
// Fix any percentage widths to be pixel values
var hasPct = false;
+ this.grid.initialWidth = "";
var cellNodes = dojo.query("th", this.headerContentNode);
var fixedWidths = dojo.map(cellNodes, function(c, vIdx){
var w = c.style.width;
Added: dojox/trunk/grid/tests/test_data_grid_autowidth.html
==============================================================================
--- (empty file)
+++ dojox/trunk/grid/tests/test_data_grid_autowidth.html Mon Jun 15 10:45:20 2009
@@ -0,0 +1,83 @@
+<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
+ "http://www.w3.org/TR/html4/loose.dtd">
+<html>
+<head>
+ <title>Test dojox.grid.DataGrid Automatic Width</title>
+ <meta http-equiv="Content-Type" content="text/html; charset=utf-8"></meta>
+ <style type="text/css">
+ @import "../../../dojo/resources/dojo.css";
+ @import "../resources/Grid.css";
+ @import "../resources/tundraGrid.css";
+ body {
+ font-size: 0.9em;
+ font-family: Geneva, Arial, Helvetica, sans-serif;
+ }
+ .heading {
+ font-weight: bold;
+ padding-bottom: 0.25em;
+ }
+ .grid {
+ width: 85%;
+ height: 20em;
+ padding: 1px;
+ }
+ </style>
+ <script type="text/javascript" src="../../../dojo/dojo.js"
+ djConfig="isDebug:false, parseOnLoad: true"></script>
+ <script type="text/javascript">
+ dojo.require("dijit.dijit");
+ dojo.require("dojox.grid.DataGrid");
+ dojo.require("dojo.data.ItemFileWriteStore");
+ dojo.require("dojo.parser");
+
+ dojo.addOnLoad(function(){
+ // A quick-and-dirty resize of the grid when the window resizes to
+ // test that percentages "stick" when they are supposed to.
+ dojo.connect(window, "resize", grid2, "resize");
+ });
+ </script>
+ <script type="text/javascript" src="support/test_data.js"></script>
+</head>
+<body class="tundra">
+ <div class="heading">dojox.grid.DataGrid Automatic Width Test</div>
+ <span dojoType="dojo.data.ItemFileWriteStore"
+ jsId="jsonStore" url="../../../dijit/tests/_data/countries.json">
+ </span>
+ <table dojoType="dojox.grid.DataGrid"
+ jsid="grid" id="grid" class="grid" autoWidth="true"
+ store="jsonStore" query="{ name: '*' }" rowsPerPage="20" rowSelector="20px">
+ <thead>
+ <tr>
+ <th field="name" width="30em">Country/Continent Name</th>
+ <th field="type" width="10em">Type</th>
+ <th field="population" width="10em">Population</th>
+ </tr>
+ </thead>
+ </table>
+ <div class="heading">Auto Width with % column widths (and fixed initial grid width)</div>
+ <table dojoType="dojox.grid.DataGrid"
+ jsid="grid1" id="grid1" class="grid" autoWidth="true" initialWidth="50em"
+ store="jsonStore" query="{ name: '*' }" rowsPerPage="20" rowSelector="20px">
+ <thead>
+ <tr>
+ <th field="name" width="50%">Country/Continent Name</th>
+ <th field="type" width="25%">Type</th>
+ <th field="population" width="25%">Population</th>
+ </tr>
+ </thead>
+ </table>
+ <div class="heading">Auto Width with % column widths (and % initial grid width)</div>
+ <table dojoType="dojox.grid.DataGrid"
+ jsid="grid2" id="grid2" class="grid" autoWidth="true" initialWidth="85%"
+ store="jsonStore" query="{ name: '*' }" rowsPerPage="20" rowSelector="20px">
+ <thead>
+ <tr>
+ <th field="name" width="50%">Country/Continent Name</th>
+ <th field="type" width="25%">Type</th>
+ <th field="population" width="25%">Population</th>
+ </tr>
+ </thead>
+ </table>
+</body>
+</html>
+
More information about the Dojo-checkins
mailing list