When you create a REPORT query condition, you need to select multiple drop-down boxes. Ext 2.3 is not implemented by default. Looking for a code test from reference 1, we found that when there are multiple drop-down lists, there will be situations where data is messy and cannot be selected. The source code is corrected and can be used normally now. The initialization [This. Selections initialization] And setvalue () functions are modified. The source code is as follows:
/*** Code highlighting produced by actipro codehighlighter (freeware) http://www.CodeHighlighter.com/--> Ext. NS ('ext. UX ') * http://www.cnblogs.com/damnedmoon/archive/2010/05/11/1732389.html */Ext. UX. multicombox = ext. extend (ext. form. comboBox, {splitsign: ',', selections: [], checks: [], hiddenvalue: '', lastselectiontext:'', initlist: function () {var CLS = 'x-combo-list'; this. TPL ='
<Div class = "" '"=" ">
| |
{'+ This. displayfield + '} |
'; Ext. UX. multicombox. superclass. initlist. call (this); this. view. updateindexes = This. updateindexes. createdelegate (this. view); this. view. refresh = This. refresh. createdelegate (this. view, [this], 0); If (this. view. store) {This. view. setstore (this. view. store, true);} // re-initialize, otherwise multiple drop-down boxes will mix one variable this. selections = [];}, refresh: function (Multi) {This. clearselections (false, true); this. el. update (""); VA R records = This. Store. getrange (); If (records. Length <1) {If (! This. deferemptytext | this. hasskippedemptytext) {This. el. update (this. emptytext);} This. hasskippedemptytext = true; this. all. clear (); return;} This. TPL. overwrite (this. el, this. collectdata (records, 0); this. all. fill (ext. query (this. itemselector, this. el. dom); Multi. createcheck (); this. updateindexes (0) ;}, updateindexes: function (startindex, endindex) {var NS = This. all. elements; startindex = s Tartindex | 0; endindex = endindex | (endindex = 0 )? 0: (NS. length-1); For (VAR I = startindex; I <= endindex; I ++) {NS [I]. viewindex = I; If (NS [I]. checkbox) {NS [I]. checkbox. index = I ;}}, createcheck: function () {This. checks = []; for (VAR I = 0; I <this. view. all. elements. length; I ++) {var El = This. view. all. elements [I]; var check = new Ext. form. checkbox ({width: 20, renderto: ext. getbody (), // readonly: True, // disable, enable effective disabled: True}); check. initcheckevents = ext. emptyfn (); var M = {index: El. viewindex, check: Check, node: El}; El. checkbox = m; this. checks. push (m); Ext. fly (EL ). select ('. check-box '). insertfirst (check. WRAP) ;}, findcheckbox: function (INDEX) {for (VAR I = 0; I <this. checks. length; I ++) {If (this. checks [I]. index = index) return this. checks [I];} return NULL;}, onselect: function (record, index, Checked) {If (this. fireevent ('beforeselect ', this, record, index )! = False) {If (! Record) return; var checkobj = This. findcheckbox (INDEX); var checkbox = checkobj & checkobj. Check; If (! Checkbox) return; If (checked = undefined) Checked = checkbox. checked; this. togglecheckbox (index, checked, record, checkbox); this. select (index, false); // used to set the selection style this. fireevent ('select', this, record, index) ;}}, togglecheckbox: function (index, checked, R, item) {If (checked = false) {item. setvalue (1); If (this. isexist (INDEX) = true) return; this. selections. push ({record: R, index: Index });} Else {item. setvalue (0); For (VAR I = 0; I <this. selections. length; I ++) {If (Index = This. selections [I]. index) {This. selections. remove (this. selections [I]) ;}} this. setvalue (R. data [this. valuefield | this. displayfield], checked) ;}, isexist: function (INDEX) {for (VAR I = 0; I <this. selections. length; I ++) {If (this. selections [I]. index = index) {return true ;}} return false ;}, Setvalue: function (v, checked) {var split = ext. escapere (this. splitsign); var text = split + this. lastselectiontext + split; var hiddenvalue = split + this. hiddenvalue + split; VaR values = v. tostring (). split (this. splitsign); for (I = 0, L = values. length; I <L; I ++) {var r = This. findrecord (this. valuefield, values [I]); If (r) {var name = R. data [this. displayfield], value = R. data [this. valuef Ield]; var con = ext. escapere (name. tostring (), val = ext. escapere (value. tostring (); // var nemere = new Regexp ("(^" + con + "[" + split + "]? "+") "// +" | (["+ Split +"]? "+ Con +") ", 'G'); // var valuere = new Regexp (" (^ "+ Val +" ["+ split +"]? "+") "// +" | (["+ Split +"]? "+ Val +") ", 'G'); var nemere = new Regexp (" ("+ split + con + split +") ", 'G '); vaR valuere = new Regexp ("(" + split + Val + split + ")", 'G '); if (checked = false | typeof checked = "undefined") {text = text. replace (nemere, split); hiddenvalue = hiddenvalue. replace (valuere, split); If (text. length <= 2 * Split. length) {// when the null value is set, text = split + name + split; hiddenvalue = split + value + spli T;} else {text = text + name + split; hiddenvalue = hiddenvalue + value + split;} // var separate =! Text? "": This. splitsign;} else {text = text. replace (nemere, split); hiddenvalue = hiddenvalue. replace (valuere, split); If (text. length <2 * Split. length) {text = split + split; hiddenvalue = split + split ;}}} this. lastselectiontext = text. substring (split. length, text. length-split. length); Ext. form. comboBox. superclass. setvalue. call (this, this. lastselectiontext); this. hiddenvalue = hiddenvalu E. substring (split. length, hiddenvalue. length-split. length); // | this. hiddenvalue; If (this. hiddenfield) {This. hiddenfield. value = This. hiddenvalue;} This. value = This. hiddenvalue;}, getvalue: function () {return Ext. UX. multicombox. superclass. getvalue. call (this) ;}, selectbyvalue: function (v, scrollintoview) {VaR value = This. getrawvalue (). trim () | ""; var V1 = value. trim (). split (this. SPL Itsign); For (VAR I = 0; I <v1.length; I ++) {var v = V1 [I]; If (v) {var r = This. findrecord (this. displayfield, V); this. onselect (R, this. store. indexof (R), false) ;}}, getrawvalue: function (FLAG) {var v = This. rendered? This. el. getvalue (): ext. value (this. value, ''); If (V = This. emptytext) {v = '';} If (flag! = True) return V; var V1 = v. trim (). split (this. splitsign); If (v1.length> 0) {var v2 = ""; for (VAR I = 0; I <v1.length; I ++) {If (V1 [I]) v2 = V2 + "(" + V1 [I] + ")" + "|";} If (v2.length-2> 0) v2 = v2.substring (0, v2.length-1); V = new Regexp (V2); V. length = v2.length;} return V;}, onload: function () {If (! This. hasfocus) {return;} If (this. store. getcount ()> 0) {This. expand (); this. restrictheight (); If (this. lastquery = This. allquery) {If (this. editable) This. el. dom. select (); this. selectbyvalue (this. value, true);} else {This. selectbyvalue (this. value, true)} else {This. onemptyresults () ;}}, initquery: function () {This. doquery (this. getrawvalue (true) ;}, ontriggerclick: function () {If (this. disabled) {return;} If (this. isexpanded () {This. collapse (); this. el. focus ();} else {This. onfocus ({}); If (this. triggeraction = 'all') {This. doquery (this. allquery, true);} else {This. doquery (this. getrawvalue (true);} This. el. focus () ;}, Reset: function () {This. clearall (); Ext. form. comboBox. superclass. reset. call (this) ;}, clearall: function () {for (VAR I = 0; I <this. checks. length; I ++) {This. checks [I]. check. setvalue (0);} This. lastselectiontext = ""; this. hiddenvalue = ""; this. value = ""; this. selections = []; this. setrawvalue (""); Ext. form. comboBox. superclass. setvalue. call (this, "") ;}}); Ext. reg ('multicombox', ext. UX. multicombox);/** Ext. onready (function () {var mydata = [[3300, "Peng renqi"], [3301, "Li Ming"], [3302, * "Wang Hua"], [3303, "Zhang San"], [3304, "Li Si"], [3305, "Wang Wu"], [3306, "Peng Xiaoming"], [3307, "Zhang Hua"], * [3308, ""]; ** var store1 = new Ext. data. simplestore ({fields: [{Name: 'value', type: * 'string'}, {Name: 'name', type: 'string'}], data: mydata}); ** var test = new Ext. UX. multicombox ({store: store1, displayfield: 'name', * valuefield: 'value', // typeahead: True, triggeraction: 'all', mode: * 'local ', emptytext: 'select... ', selectonfocus: True, loadingtext: * 'loading .... '}) test. render (ext. getbody ());});*/
The call code is the same as that of combox, for example:
Items: [{xtype: 'multicombox', fieldlabel: 'Multiple data select', ID: 'P _ data', name: 'P _ data', anchor: '123 ', triggeraction: 'all', valuefield: 'name', displayfield: "name", readonly: True, store: datastore, mode: 'remote'}]
Preview Effect
References:
[1] ext JS multi-choice control multicombo. http://www.cnblogs.com/damnedmoon/archive/2010/05/11/1732389.html
