* @cfg {Boolean} animate default true
* @cfg {Boolean} emptyResultText only for touch device
* @cfg {String} triggerText multiple combobox trigger button text default 'Select'
+ * @cfg {String} emptyTitle default ''
* @constructor
* Create a new ComboBox.
* @param {Object} config Configuration options
animate : true,
emptyResultText: 'Empty',
triggerText : 'Select',
+ emptyTitle : '',
// element that contains real text value.. (when hidden is used..)
getAutoCreate : function()
- {
+ {
var cfg = false;
-
+ //render
/*
* Render classic select for iso
*/
tag: 'li',
cls: 'roo-select2-search-field',
cn: [
-
buttons
]
}
combobox.cn.push(feedback);
}
- if (align ==='left' && this.fieldLabel.length && this.labelWidth) {
+
+ if (align ==='left' && this.fieldLabel.length) {
+
+ cfg.cls += ' roo-form-group-label-left';
cfg.cn = [
{
{
tag: 'label',
'for' : id,
- cls : 'control-label col-sm-' + this.labelWidth,
+ cls : 'control-label',
html : this.fieldLabel
},
{
- cls : "col-sm-" + (12 - this.labelWidth),
+ cls : "",
cn: [
combobox
]
}
];
+
+ var labelCfg = cfg.cn[1];
+ var contentCfg = cfg.cn[2];
+
if(this.indicatorpos == 'right'){
{
tag: 'label',
'for' : id,
- cls : 'control-label col-sm-' + this.labelWidth,
- html : this.fieldLabel
-
- },
- {
- tag : 'i',
- cls : 'roo-required-indicator right-indicator text-danger fa fa-lg fa-star',
- tooltip : 'This field is required'
+ cls : 'control-label',
+ cn : [
+ {
+ tag : 'span',
+ html : this.fieldLabel
+ },
+ {
+ tag : 'i',
+ cls : 'roo-required-indicator right-indicator text-danger fa fa-lg fa-star',
+ tooltip : 'This field is required'
+ }
+ ]
},
{
- cls : "col-sm-" + (12 - this.labelWidth),
+ cls : "",
cn: [
combobox
]
}
];
+
+
+
+ labelCfg = cfg.cn[0];
+ contentCfg = cfg.cn[1];
+
+ }
+
+ if(this.labelWidth > 12){
+ labelCfg.style = "width: " + this.labelWidth + 'px';
+ }
+
+ if(this.labelWidth < 13 && this.labelmd == 0){
+ this.labelmd = this.labelWidth;
+ }
+ if(this.labellg > 0){
+ labelCfg.cls += ' col-lg-' + this.labellg;
+ contentCfg.cls += ' col-lg-' + (12 - this.labellg);
+ }
+
+ if(this.labelmd > 0){
+ labelCfg.cls += ' col-md-' + this.labelmd;
+ contentCfg.cls += ' col-md-' + (12 - this.labelmd);
+ }
+
+ if(this.labelsm > 0){
+ labelCfg.cls += ' col-sm-' + this.labelsm;
+ contentCfg.cls += ' col-sm-' + (12 - this.labelsm);
+ }
+
+ if(this.labelxs > 0){
+ labelCfg.cls += ' col-xs-' + this.labelxs;
+ contentCfg.cls += ' col-xs-' + (12 - this.labelxs);
}
tag: 'label',
//cls : 'input-group-addon',
html : this.fieldLabel
-
},
-
combobox
-
];
if(this.indicatorpos == 'right'){
-
cfg.cn = [
{
tag: 'label',
//cls : 'input-group-addon',
html : this.fieldLabel
-
},
-
{
tag : 'i',
cls : 'roo-required-indicator right-indicator text-danger fa fa-lg fa-star',
tooltip : 'This field is required'
},
-
combobox
-
];
-
+
}
} else {
}
this.store = Roo.factory(this.store, Roo.data);
+ this.store.parent = this;
// if we are building from html. then this element is so complex, that we can not really
// use the rendered HTML.
this.view.on('click', this.onViewClick, this);
-
this.store.on('beforeload', this.onBeforeLoad, this);
this.store.on('load', this.onLoad, this);
this.store.on('loadexception', this.onLoadException, this);
this.tickableInputEl().on("keyup", this.onKeyUp, this);
}
+ this.indicator = this.indicatorEl();
+
+ if(this.indicator){
+ this.indicator.setVisibilityMode(Roo.Element.DISPLAY);
+ this.indicator.hide();
+ }
+
},
onDestroy : function(){
if(typeof(this.loading) !== 'undefined' && this.loading !== null){
this.loading.hide();
}
-
+
if(this.store.getCount() > 0){
+
this.expand();
this.restrictHeight();
if(this.lastQuery == this.allQuery){
{
tag: 'a',
href: '#',
- cls: 'roo-select2-search-choice-close',
+ cls: 'roo-select2-search-choice-close fa fa-times',
tabindex: '-1'
}
]
var align = this.labelAlign || this.parentLabelAlign();
- cfg.cn = combobox;
-
- if(this.fieldLabel.length && this.labelWidth){
-
- var lw = align === 'left' ? ('col-sm' + this.labelWidth) : '';
- var cw = align === 'left' ? ('col-sm' + (12 - this.labelWidth)) : '';
-
+ if (align ==='left' && this.fieldLabel.length) {
+
cfg.cn = [
{
tag : 'i',
},
{
tag: 'label',
- cls : 'control-label ' + lw,
+ cls : 'control-label',
html : this.fieldLabel
},
{
- cls : cw,
+ cls : '',
cn: [
combobox
]
}
];
+ var labelCfg = cfg.cn[1];
+ var contentCfg = cfg.cn[2];
+
+
if(this.indicatorpos == 'right'){
cfg.cn = [
{
tag: 'label',
- cls : 'control-label ' + lw,
- html : this.fieldLabel
-
+ cls : 'control-label',
+ html : this.fieldLabel,
+ cn : [
+ {
+ tag : 'i',
+ cls : 'roo-required-indicator right-indicator text-danger fa fa-lg fa-star',
+ tooltip : 'This field is required'
+ }
+ ]
},
{
- tag : 'i',
- cls : 'roo-required-indicator right-indicator text-danger fa fa-lg fa-star',
- tooltip : 'This field is required'
+ cls : '',
+ cn: [
+ combobox
+ ]
+ }
+ ];
+ }
+
+ labelCfg = cfg.cn[0];
+ contentCfg = cfg.cn[2];
+
+ if(this.labelWidth > 12){
+ labelCfg.style = "width: " + this.labelWidth + 'px';
+ }
+
+ if(this.labelWidth < 13 && this.labelmd == 0){
+ this.labelmd = this.labelWidth;
+ }
+
+ if(this.labellg > 0){
+ labelCfg.cls += ' col-lg-' + this.labellg;
+ contentCfg.cls += ' col-lg-' + (12 - this.labellg);
+ }
+
+ if(this.labelmd > 0){
+ labelCfg.cls += ' col-md-' + this.labelmd;
+ contentCfg.cls += ' col-md-' + (12 - this.labelmd);
+ }
+
+ if(this.labelsm > 0){
+ labelCfg.cls += ' col-sm-' + this.labelsm;
+ contentCfg.cls += ' col-sm-' + (12 - this.labelsm);
+ }
+
+ if(this.labelxs > 0){
+ labelCfg.cls += ' col-xs-' + this.labelxs;
+ contentCfg.cls += ' col-xs-' + (12 - this.labelxs);
+ }
+
+
+ } else if ( this.fieldLabel.length) {
+ cfg.cn = [
+ {
+ tag : 'i',
+ cls : 'roo-required-indicator left-indicator text-danger fa fa-lg fa-star',
+ tooltip : 'This field is required'
+ },
+ {
+ tag: 'label',
+ cls : 'control-label',
+ html : this.fieldLabel
+
+ },
+ {
+ cls : '',
+ cn: [
+ combobox
+ ]
+ }
+ ];
+
+ if(this.indicatorpos == 'right'){
+ cfg.cn = [
+ {
+ tag: 'label',
+ cls : 'control-label',
+ html : this.fieldLabel,
+ cn : [
+ {
+ tag : 'i',
+ cls : 'roo-required-indicator right-indicator text-danger fa fa-lg fa-star',
+ tooltip : 'This field is required'
+ }
+ ]
},
{
- cls : cw,
+ cls : '',
cn: [
combobox
]
}
];
}
+ } else {
+ cfg.cn = combobox;
}
+
var settings = this;
['xs','sm','md','lg'].map(function(size){