Ext. UX. Form. lovcombo. js select multiple options under ext3.4.0. When the mouse leaves, the selected project disappears.

First download lovcombo address for http://lovcombo.extjs.eu/

Extjs3.0 and this Dongdong have a bug, that is, after selection, the loss of the focus value will disappear.

Solution: Add beforeblur to Ext. UX. Form. lovcombo. js. The method is

Before the setvalue of Ext. UX. Form. lovcombo. JS, add

 

Beforeblur: function (){
Var val = This. getrawvalue ();
If (this. forceselection ){
If (Val. length> 0 & Val! = This. emptytext ){
This. El. Dom. value = ext. isdefined (this. lastselectiontext )? This. lastselectiontext :'';
This. applyemptytext ();
} Else {
This. clearvalue ();
}
} Else {
VaR texts = Val. Split (',');
VaR values = '';
For (VAR I = 0; I <texts. length; I ++ ){
VaR rec = This. findrecord (this. displayfield, texts [I]. Trim ());
If (REC ){
Values + = (values. length> 0? ',': '') + Rec. Data [This. valuefield];
}
}
This. setvalue (values );
}
}

 

You can.

The HTML code is

 

Ext. onready (function (){
Ext. quicktips. INIT ();
// Create a record type person
VaR person = ext. Data. Record. Create ([{
Name: 'value ',
Mapping: 0 // 0th elements in the array
},{
Name: 'text ',
Mapping: 1 // 1st elements in the array
}]);

// Create a data parser
VaR reader = new Ext. Data. arrayreader ({
ID: 0 // required. The array contains 0th elements as the record ID.
}, Person );
 
// Create an httpproxy proxy
 
VaR DATA = [[1, "one"], [2, "dfdfs"], [3, "gerge"], [4, "dfdsfsdf"];
VaR proxy = new Ext. Data. memoryproxy (data );
 
// Create a dataset store
VaR DS = new Ext. Data. Store ({
Autoload: True,
Proxy: proxy,
Reader: Reader
});

VaR Kp = new Ext. UX. Form. lovcombo ({
Renderto: Ext. getbody (),
Name: "inzlstus ",
Fieldlabel: "asset status ",
Store: ds,
Mode: 'local ',
Triggeraction: 'all ',
Hidetrigger: false,
Allowblank: True,
Displayfield: 'text ',
Valuefield: 'value ',
Emptytext: 'select asset category ',
Editable: false
});

 
VaR TF = new Ext. Form. textfield ({
Renderto: Ext. getbody ()
, ID: 'tf'
, Width: 300
, Selectonfocus: false
, Listeners :{
Focus: function () {This. setvalue (LCC. getvalue ());}
}
});
LCC. Render
})

 

If the image does not show the image path of its ext.ux.form.lovcombo.css modified

I forgot a key question: the CSS and JS files to be imported

 

<LINK rel = "stylesheet" type = "text/CSS" href = "CSS/ext-all.css"/>
<LINK rel = "stylesheet" type = "text/CSS" href = "JS/ajax/extjs/lovc/CSS/ext.ux.form.lovcombo.css">

<SCRIPT type = "text/JavaScript" src = "JS/ajax/extjs/EXT/adapter/ext-base.js"> </SCRIPT>
<SCRIPT type = "text/JavaScript" src = "JS/ajax/extjs/EXT/ext-all.js"> </SCRIPT>
<SCRIPT type = "text/JavaScript" src = "JS/ajax/extjs/lovc/JS/EXT. UX. Form. lovcombo. js"> </SCRIPT>

Don't forget the order!