source: trunk/web/addons/job_monarch/lib/extjs/examples/form/SelectBox.js @ 619

Last change on this file since 619 was 619, checked in by ramonb, 15 years ago

lib/:

  • added new AJAX dependancies: ExtJS, pChart, Lightbox2
File size: 5.4 KB
Line 
1/*
2 * Ext JS Library 2.2.1
3 * Copyright(c) 2006-2009, Ext JS, LLC.
4 * licensing@extjs.com
5 *
6 * http://extjs.com/license
7 */
8
9/**
10 * Makes a ComboBox more closely mimic an HTML SELECT.  Supports clicking and dragging
11 * through the list, with item selection occurring when the mouse button is released.
12 * When used will automatically set {@link #editable} to false and call {@link Ext.Element#unselectable}
13 * on inner elements.  Re-enabling editable after calling this will NOT work.
14 *
15 * @author Corey Gilmore
16 * http://extjs.com/forum/showthread.php?t=6392
17 *
18 * @history 2007-07-08 jvs
19 * Slight mods for Ext 2.0
20 */
21Ext.ux.SelectBox = function(config){
22        this.searchResetDelay = 1000;
23        config = config || {};
24        config = Ext.apply(config || {}, {
25                editable: false,
26                forceSelection: true,
27                rowHeight: false,
28                lastSearchTerm: false,
29        triggerAction: 'all',
30        mode: 'local'
31    });
32
33        Ext.ux.SelectBox.superclass.constructor.apply(this, arguments);
34
35        this.lastSelectedIndex = this.selectedIndex || 0;
36};
37
38Ext.extend(Ext.ux.SelectBox, Ext.form.ComboBox, {
39
40        initEvents : function(){
41                Ext.ux.SelectBox.superclass.initEvents.apply(this, arguments);
42                // you need to use keypress to capture upper/lower case and shift+key, but it doesn't work in IE
43                this.el.on('keydown', this.keySearch, this, true);
44                this.cshTask = new Ext.util.DelayedTask(this.clearSearchHistory, this);
45        },
46
47        keySearch : function(e, target, options) {
48                var raw = e.getKey();
49                var key = String.fromCharCode(raw);
50                var startIndex = 0;
51
52                if( !this.store.getCount() ) {
53                        return;
54                }
55
56                switch(raw) {
57                        case Ext.EventObject.HOME:
58                                e.stopEvent();
59                                this.selectFirst();
60                                return;
61
62                        case Ext.EventObject.END:
63                                e.stopEvent();
64                                this.selectLast();
65                                return;
66
67                        case Ext.EventObject.PAGEDOWN:
68                                this.selectNextPage();
69                                e.stopEvent();
70                                return;
71
72                        case Ext.EventObject.PAGEUP:
73                                this.selectPrevPage();
74                                e.stopEvent();
75                                return;
76                }
77
78                // skip special keys other than the shift key
79                if( (e.hasModifier() && !e.shiftKey) || e.isNavKeyPress() || e.isSpecialKey() ) {
80                        return;
81                }
82                if( this.lastSearchTerm == key ) {
83                        startIndex = this.lastSelectedIndex;
84                }
85                this.search(this.displayField, key, startIndex);
86                this.cshTask.delay(this.searchResetDelay);
87        },
88
89        onRender : function(ct, position) {
90                this.store.on('load', this.calcRowsPerPage, this);
91                Ext.ux.SelectBox.superclass.onRender.apply(this, arguments);
92                if( this.mode == 'local' ) {
93                        this.calcRowsPerPage();
94                }
95        },
96
97        onSelect : function(record, index, skipCollapse){
98                if(this.fireEvent('beforeselect', this, record, index) !== false){
99                        this.setValue(record.data[this.valueField || this.displayField]);
100                        if( !skipCollapse ) {
101                                this.collapse();
102                        }
103                        this.lastSelectedIndex = index + 1;
104                        this.fireEvent('select', this, record, index);
105                }
106        },
107
108        render : function(ct) {
109                Ext.ux.SelectBox.superclass.render.apply(this, arguments);
110                if( Ext.isSafari ) {
111                        this.el.swallowEvent('mousedown', true);
112                }
113                this.el.unselectable();
114                this.innerList.unselectable();
115                this.trigger.unselectable();
116                this.innerList.on('mouseup', function(e, target, options) {
117                        if( target.id && target.id == this.innerList.id ) {
118                                return;
119                        }
120                        this.onViewClick();
121                }, this);
122
123                this.innerList.on('mouseover', function(e, target, options) {
124                        if( target.id && target.id == this.innerList.id ) {
125                                return;
126                        }
127                        this.lastSelectedIndex = this.view.getSelectedIndexes()[0] + 1;
128                        this.cshTask.delay(this.searchResetDelay);
129                }, this);
130
131                this.trigger.un('click', this.onTriggerClick, this);
132                this.trigger.on('mousedown', function(e, target, options) {
133                        e.preventDefault();
134                        this.onTriggerClick();
135                }, this);
136
137                this.on('collapse', function(e, target, options) {
138                        Ext.getDoc().un('mouseup', this.collapseIf, this);
139                }, this, true);
140
141                this.on('expand', function(e, target, options) {
142                        Ext.getDoc().on('mouseup', this.collapseIf, this);
143                }, this, true);
144        },
145
146        clearSearchHistory : function() {
147                this.lastSelectedIndex = 0;
148                this.lastSearchTerm = false;
149        },
150
151        selectFirst : function() {
152                this.focusAndSelect(this.store.data.first());
153        },
154
155        selectLast : function() {
156                this.focusAndSelect(this.store.data.last());
157        },
158
159        selectPrevPage : function() {
160                if( !this.rowHeight ) {
161                        return;
162                }
163                var index = Math.max(this.selectedIndex-this.rowsPerPage, 0);
164                this.focusAndSelect(this.store.getAt(index));
165        },
166
167        selectNextPage : function() {
168                if( !this.rowHeight ) {
169                        return;
170                }
171                var index = Math.min(this.selectedIndex+this.rowsPerPage, this.store.getCount() - 1);
172                this.focusAndSelect(this.store.getAt(index));
173        },
174
175        search : function(field, value, startIndex) {
176                field = field || this.displayField;
177                this.lastSearchTerm = value;
178                var index = this.store.find.apply(this.store, arguments);
179                if( index !== -1 ) {
180                        this.focusAndSelect(index);
181                }
182        },
183
184        focusAndSelect : function(record) {
185                var index = typeof record === 'number' ? record : this.store.indexOf(record);
186                this.select(index, this.isExpanded());
187                this.onSelect(this.store.getAt(record), index, this.isExpanded());
188        },
189
190        calcRowsPerPage : function() {
191                if( this.store.getCount() ) {
192                        this.rowHeight = Ext.fly(this.view.getNode(0)).getHeight();
193                        this.rowsPerPage = this.maxHeight / this.rowHeight;
194                } else {
195                        this.rowHeight = false;
196                }
197        }
198
199});
Note: See TracBrowser for help on using the repository browser.