fix docs

[roojs1] / Roo / bootstrap / DateSplitField.js

diff --git a/Roo/bootstrap/DateSplitField.js b/Roo/bootstrap/DateSplitField.js
index 2e55746..3f6d16b 100644 (file)
--- a/Roo/bootstrap/DateSplitField.js
+++ b/Roo/bootstrap/DateSplitField.js
@@ -22,6 +22,10 @@
  * @cfg {string} dayFormat default 'd'
  * @cfg {string} monthFormat default 'm'
  * @cfg {string} yearFormat default 'Y'
+ * @cfg {Number} labellg set the width of label (1-12)
+ * @cfg {Number} labelmd set the width of label (1-12)
+ * @cfg {Number} labelsm set the width of label (1-12)
+ * @cfg {Number} labelxs set the width of label (1-12)
 
  *     
  * @constructor
@@ -79,6 +83,10 @@ Roo.extend(Roo.bootstrap.DateSplitField, Roo.bootstrap.Component,  {
     monthFormat : 'm',
     yearFormat : 'Y',
     isFormField : true,
+    labellg : 0,
+    labelmd : 0,
+    labelsm : 0,
+    labelxs : 0,
     
     getAutoCreate : function()
     {
@@ -89,13 +97,18 @@ Roo.extend(Roo.bootstrap.DateSplitField, Roo.bootstrap.Component,  {
                 {
                     tag : 'input',
                     type : 'hidden',
-                    cls : 'form-hidden-field roo-date-split-field-group-value'
+                    cls : 'form-hidden-field roo-date-split-field-group-value',
+                    name : this.name
                 }
             ]
-        }
+        };
+        
+        var labelCls = 'col-md-12';
+        var contentCls = 'col-md-4';
         
         if(this.fieldLabel){
-            cfg.cn.push({
+            
+            var label = {
                 tag : 'div',
                 cls : 'column roo-date-split-field-label col-md-' + ((this.labelAlign == 'top') ? '12' : this.labelWidth),
                 cn : [
@@ -104,13 +117,48 @@ Roo.extend(Roo.bootstrap.DateSplitField, Roo.bootstrap.Component,  {
                         html : this.fieldLabel
                     }
                 ]
-            });
+            };
+            
+            if(this.labelAlign == 'left'){
+            
+                if(this.labelWidth > 12){
+                    label.style = "width: " + this.labelWidth + 'px';
+                }
+
+                if(this.labelWidth < 13 && this.labelmd == 0){
+                    this.labelmd = this.labelWidth;
+                }
+
+                if(this.labellg > 0){
+                    labelCls = ' col-lg-' + this.labellg;
+                    contentCls = ' col-lg-' + ((12 - this.labellg) / 3);
+                }
+
+                if(this.labelmd > 0){
+                    labelCls = ' col-md-' + this.labelmd;
+                    contentCls = ' col-md-' + ((12 - this.labelmd) / 3);
+                }
+
+                if(this.labelsm > 0){
+                    labelCls = ' col-sm-' + this.labelsm;
+                    contentCls = ' col-sm-' + ((12 - this.labelsm) / 3);
+                }
+
+                if(this.labelxs > 0){
+                    labelCls = ' col-xs-' + this.labelxs;
+                    contentCls = ' col-xs-' + ((12 - this.labelxs) / 3);
+                }
+            }
+            
+            label.cls += ' ' + labelCls;
+            
+            cfg.cn.push(label);
         }
         
         Roo.each(['day', 'month', 'year'], function(t){
             cfg.cn.push({
                 tag : 'div',
-                cls : 'column roo-date-split-field-' + t + ' col-md-' + ((this.labelAlign == 'top') ? '4' : ((12 - this.labelWidth) / 3))
+                cls : 'column roo-date-split-field-' + t + ' ' + contentCls
             });
         }, this);
         
@@ -140,7 +188,7 @@ Roo.extend(Roo.bootstrap.DateSplitField, Roo.bootstrap.Component,  {
             mode : 'local',
             placeholder : this.dayPlaceholder,
             selectOnFocus : true,
-            tpl : '<div class="select2-result"><b>{value}</b></div>',
+            tpl : '<div class="roo-select2-result"><b>{value}</b></div>',
             triggerAction : 'all',
             typeAhead : true,
             valueField : 'value',
@@ -155,7 +203,7 @@ Roo.extend(Roo.bootstrap.DateSplitField, Roo.bootstrap.Component,  {
             listeners : {
                 select : function (_self, record, index)
                 {
-                    _this.validate();
+                    _this.setValue(_this.getValue());
                 }
             }
         });
@@ -177,7 +225,7 @@ Roo.extend(Roo.bootstrap.DateSplitField, Roo.bootstrap.Component,  {
                 },
                 select : function (_self, oldvalue, newvalue)
                 {
-                    _this.validate();
+                    _this.setValue(_this.getValue());
                 }
             }
         });
@@ -194,7 +242,7 @@ Roo.extend(Roo.bootstrap.DateSplitField, Roo.bootstrap.Component,  {
             mode : 'local',
             placeholder : this.yearPlaceholder,
             selectOnFocus : true,
-            tpl : '<div class="select2-result"><b>{value}</b></div>',
+            tpl : '<div class="roo-select2-result"><b>{value}</b></div>',
             triggerAction : 'all',
             typeAhead : true,
             valueField : 'value',
@@ -209,7 +257,7 @@ Roo.extend(Roo.bootstrap.DateSplitField, Roo.bootstrap.Component,  {
             listeners : {
                 select : function (_self, record, index)
                 {
-                    _this.validate();
+                    _this.setValue(_this.getValue());
                 }
             }
         });
@@ -219,15 +267,20 @@ Roo.extend(Roo.bootstrap.DateSplitField, Roo.bootstrap.Component,  {
     
     setValue : function(v, format)
     {
+        this.inputEl.dom.value = v;
+        
         var f = format || (this.yearFormat + '-' + this.monthFormat + '-' + this.dayFormat);
         
         var d = Date.parseDate(v, f);
         
-        this.dayField.setValue(d.format(this.dayFormat));
-        this.monthField.setValue(d.format(this.monthFormat));
-        this.yearField.setValue(d.format(this.yearFormat));
+        if(!d){
+            this.validate();
+            return;
+        }
         
-        this.inputEl().setValue(d.format(f));
+        this.setDay(d.format(this.dayFormat));
+        this.setMonth(d.format(this.monthFormat));
+        this.setYear(d.format(this.yearFormat));
         
         this.validate();
         
@@ -237,14 +290,15 @@ Roo.extend(Roo.bootstrap.DateSplitField, Roo.bootstrap.Component,  {
     setDay : function(v)
     {
         this.dayField.setValue(v);
+        this.inputEl.dom.value = this.getValue();
         this.validate();
-        
         return;
     },
     
     setMonth : function(v)
     {
-        this.monthField.setValue(v);
+        this.monthField.setValue(v, true);
+        this.inputEl.dom.value = this.getValue();
         this.validate();
         return;
     },
@@ -252,10 +306,26 @@ Roo.extend(Roo.bootstrap.DateSplitField, Roo.bootstrap.Component,  {
     setYear : function(v)
     {
         this.yearField.setValue(v);
+        this.inputEl.dom.value = this.getValue();
         this.validate();
         return;
     },
     
+    getDay : function()
+    {
+        return this.dayField.getValue();
+    },
+    
+    getMonth : function()
+    {
+        return this.monthField.getValue();
+    },
+    
+    getYear : function()
+    {
+        return this.yearField.getValue();
+    },
+    
     getValue : function()
     {
         var f = this.yearFormat + '-' + this.monthFormat + '-' + this.dayFormat;
@@ -265,6 +335,16 @@ Roo.extend(Roo.bootstrap.DateSplitField, Roo.bootstrap.Component,  {
         return date;
     },
     
+    reset : function()
+    {
+        this.setDay('');
+        this.setMonth('');
+        this.setYear('');
+        this.inputEl.dom.value = '';
+        this.validate();
+        return;
+    },
+    
     validate : function()
     {
         var d = this.dayField.validate();