r807 - in branches/1.7: . tests/visual
Author: paul.bakaus
Date: Fri Oct 17 07:35:44 2008
New Revision: 807
Modified:
branches/1.7/tests/visual/grid.html
branches/1.7/ui.grid.js
branches/1.7/ui.selectable.js
Log:
grid: included selecting of rows
Modified: branches/1.7/tests/visual/grid.html
==============================================================================
--- branches/1.7/tests/visual/grid.html (original)
+++ branches/1.7/tests/visual/grid.html Fri Oct 17 07:35:44 2008
@@ -7,6 +7,7 @@
<script type="text/javascript"
src="../../../../trunk/ui/ui.core.js"></script>
<script type="text/javascript" src="../../ui.grid.js"></script>
<script type="text/javascript" src="../../ui.gridmodel.js"></script>
+ <script type="text/javascript" src="../../ui.selectable.js"></script>
<style type="text/css" media="screen">
@@ -65,6 +66,10 @@
.ui-grid-row-hover td {
background: #eee;
+ }
+
+ .ui-grid-row-selected td {
+ background: #bbb;
}
Modified: branches/1.7/ui.grid.js
==============================================================================
--- branches/1.7/ui.grid.js (original)
+++ branches/1.7/ui.grid.js Fri Oct 17 07:35:44 2008
@@ -46,9 +46,9 @@
//Generate content element and table
- this.content = $('<tr><td><div class="ui-grid-content"
style="width:'+this.options.width+'px;
height: '+this.options.height+'px;"><table cellpadding="0"
cellspacing="0"></table></div></td></tr>')
+ this.content = $('<tr><td><div class="ui-grid-content"
style="width:'+this.options.width+'px;
height: '+this.options.height+'px;"><table cellpadding="0"
cellspacing="0"><tbody></tbody></table></div></td></tr>')
.appendTo(this.grid);
- this.content = $('table', this.content);
+ this.content = $('tbody', this.content);
//Generate footer
if(this.options.footer) {
@@ -73,6 +73,15 @@
}
});
+
+
+ //Selection of rows
+ this.content.parent().parent().selectable({
+ filter: 'tr',
+ multiple: this.options.multipleSelection,
+ selectClass: 'ui-grid-row-selected',
+ focusClass: 'ui-grid-row-focussed'
+ });
},
@@ -112,6 +121,7 @@
var testTR = $('tr:first td', this.content);
for (var i=0; i < this.columns.length; i++) {
+
$('td:eq('+i+')',
this.columnsContainer).add(testTR[i]).width(testTR[i].offsetWidth);
$('td:eq('+i+') div',
this.columnsContainer).width(testTR[i].offsetWidth - 10); //TODO: Subtract
real paddings of inner divs
@@ -158,7 +168,9 @@
pagination: true,
footer: true,
- toolbar: true
+ toolbar: true,
+
+ multipleSelection: true
}
});
Modified: branches/1.7/ui.selectable.js
==============================================================================
--- branches/1.7/ui.selectable.js (original)
+++ branches/1.7/ui.selectable.js Fri Oct 17 07:35:44 2008
@@ -19,18 +19,26 @@
var self = this;
//Set the currentFocus to the first item
- this.currentFocus = $($('> *', this.element)[0]);
+ this.currentFocus = $($(this.options.filter, this.element)[0]);
//Disable text selection
$.ui.disableSelection(this.element);
- $('> *', this.element).bind('mousedown', function(e) {
- self._select(e, this);
- self.element[0].focus();
- e.preventDefault();
- });
-
this.element
+ .bind('mousedown', function(e) {
+
+ var item;
+ $(e.target).parents().andSelf().each(function() {
+ if($(self.options.filter, self.element).index(this) != -1) item =
this;
+ });
+
+ if(!item)
+ return;
+
+ self._select(e, item);
+ self.element[0].focus();
+ e.preventDefault();
+ })
.bind('focus.selectable', function() {
self.currentFocus.addClass(self.options.focusClass);
})
@@ -109,7 +117,7 @@
//Clear the previous selection to make room for a shift selection
this._clearSelection();
- var dir = $('> *', this.element).index(this.latestWithoutModifier[0])