1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
|
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>The source code</title>
<link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="../resources/prettify/prettify.js"></script>
</head>
<body onload="prettyPrint();">
<pre class="prettyprint lang-js">/*!
* Ext JS Library 3.4.0
* Copyright(c) 2006-2011 Sencha Inc.
* licensing@sencha.com
* http://www.sencha.com/license
*/
<div id="cls-Ext.grid.CheckboxSelectionModel"></div>/**
* @class Ext.grid.CheckboxSelectionModel
* @extends Ext.grid.RowSelectionModel
* A custom selection model that renders a column of checkboxes that can be toggled to select or deselect rows.
* @constructor
* @param {Object} config The configuration options
*/
Ext.grid.CheckboxSelectionModel = Ext.extend(Ext.grid.RowSelectionModel, {
<div id="cfg-Ext.grid.CheckboxSelectionModel-checkOnly"></div>/**
* @cfg {Boolean} checkOnly <tt>true</tt> if rows can only be selected by clicking on the
* checkbox column (defaults to <tt>false</tt>).
*/
<div id="cfg-Ext.grid.CheckboxSelectionModel-header"></div>/**
* @cfg {String} header Any valid text or HTML fragment to display in the header cell for the
* checkbox column. Defaults to:<pre><code>
* '<div class="x-grid3-hd-checker">&#160;</div>'</tt>
* </code></pre>
* The default CSS class of <tt>'x-grid3-hd-checker'</tt> displays a checkbox in the header
* and provides support for automatic check all/none behavior on header click. This string
* can be replaced by any valid HTML fragment, including a simple text string (e.g.,
* <tt>'Select Rows'</tt>), but the automatic check all/none behavior will only work if the
* <tt>'x-grid3-hd-checker'</tt> class is supplied.
*/
header : '<div class="x-grid3-hd-checker"> </div>',
<div id="cfg-Ext.grid.CheckboxSelectionModel-width"></div>/**
* @cfg {Number} width The default width in pixels of the checkbox column (defaults to <tt>20</tt>).
*/
width : 20,
<div id="cfg-Ext.grid.CheckboxSelectionModel-sortable"></div>/**
* @cfg {Boolean} sortable <tt>true</tt> if the checkbox column is sortable (defaults to
* <tt>false</tt>).
*/
sortable : false,
// private
menuDisabled : true,
fixed : true,
hideable: false,
dataIndex : '',
id : 'checker',
isColumn: true, // So that ColumnModel doesn't feed this through the Column constructor
constructor : function(){
Ext.grid.CheckboxSelectionModel.superclass.constructor.apply(this, arguments);
if(this.checkOnly){
this.handleMouseDown = Ext.emptyFn;
}
},
// private
initEvents : function(){
Ext.grid.CheckboxSelectionModel.superclass.initEvents.call(this);
this.grid.on('render', function(){
Ext.fly(this.grid.getView().innerHd).on('mousedown', this.onHdMouseDown, this);
}, this);
},
/**
* @private
* Process and refire events routed from the GridView's processEvent method.
*/
processEvent : function(name, e, grid, rowIndex, colIndex){
if (name == 'mousedown') {
this.onMouseDown(e, e.getTarget());
return false;
} else {
return Ext.grid.Column.prototype.processEvent.apply(this, arguments);
}
},
// private
onMouseDown : function(e, t){
if(e.button === 0 && t.className == 'x-grid3-row-checker'){ // Only fire if left-click
e.stopEvent();
var row = e.getTarget('.x-grid3-row');
if(row){
var index = row.rowIndex;
if(this.isSelected(index)){
this.deselectRow(index);
}else{
this.selectRow(index, true);
this.grid.getView().focusRow(index);
}
}
}
},
// private
onHdMouseDown : function(e, t) {
if(t.className == 'x-grid3-hd-checker'){
e.stopEvent();
var hd = Ext.fly(t.parentNode);
var isChecked = hd.hasClass('x-grid3-hd-checker-on');
if(isChecked){
hd.removeClass('x-grid3-hd-checker-on');
this.clearSelections();
}else{
hd.addClass('x-grid3-hd-checker-on');
this.selectAll();
}
}
},
// private
renderer : function(v, p, record){
return '<div class="x-grid3-row-checker"> </div>';
},
onEditorSelect: function(row, lastRow){
if(lastRow != row && !this.checkOnly){
this.selectRow(row); // *** highlight newly-selected cell and update selection
}
}
});</pre>
</body>
</html>
|
