git.roojs.org Git - roojs1/blob - docs/src/Roo_form_DayPicker.js.html

   1 <html><head><title>Roo/form/DayPicker.js</title><link rel="stylesheet" type="text/css" href="../../css/highlight-js.css"/></head><body class="highlightpage"><code class="jsdoc-pretty"><span class="jsdoc-comment">/*
   2  *
   3  * Licence- LGPL
   4  *
   5  */
   6
   7 /**
   8  * @class Roo.form.DayPicker
   9  * @extends Roo.form.Field
  10  * A Day picker show [M] [T] [W] ....
  11  * @constructor
  12  * Creates a new Day Picker
  13  * @param {Object} config Configuration options
  14  */
  15 </span><span class="jsdoc-var">Roo.form.DayPicker</span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">){
  16     </span><span class="jsdoc-var">Roo.form.DayPicker.superclass.constructor.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">);
  17
  18 };
  19
  20 </span><span class="jsdoc-var">Roo.extend</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.form.DayPicker</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.form.Field</span><span class="jsdoc-syntax">,  {
  21     </span><span class="jsdoc-comment">/**
  22      * @cfg {String} focusClass The CSS class to use when the checkbox receives focus (defaults to undefined)
  23      */
  24     </span><span class="jsdoc-var">focusClass </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">undefined</span><span class="jsdoc-syntax">,
  25     </span><span class="jsdoc-comment">/**
  26      * @cfg {String} fieldClass The default CSS class for the checkbox (defaults to &quot;x-form-field&quot;)
  27      */
  28     </span><span class="jsdoc-var">fieldClass</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;x-form-field&quot;</span><span class="jsdoc-syntax">,
  29
  30     </span><span class="jsdoc-comment">/**
  31      * @cfg {String/Object} autoCreate A DomHelper element spec, or true for a default element spec (defaults to
  32      * {tag: &quot;input&quot;, type: &quot;checkbox&quot;, autocomplete: &quot;off&quot;})
  33      */
  34     </span><span class="jsdoc-var">defaultAutoCreate </span><span class="jsdoc-syntax">: { </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;input&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">type</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'hidden'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">autocomplete</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;new-password&quot;</span><span class="jsdoc-syntax">},
  35
  36
  37     </span><span class="jsdoc-var">actionMode </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'viewEl'</span><span class="jsdoc-syntax">,
  38     </span><span class="jsdoc-comment">//
  39     // private
  40
  41     </span><span class="jsdoc-var">inputType </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'hidden'</span><span class="jsdoc-syntax">,
  42
  43
  44     </span><span class="jsdoc-var">inputElement</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">, </span><span class="jsdoc-comment">// real input element?
  45     </span><span class="jsdoc-var">basedOn</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">, </span><span class="jsdoc-comment">// ????
  46
  47     </span><span class="jsdoc-var">isFormField</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">, </span><span class="jsdoc-comment">// not sure where this is needed!!!!
  48
  49     </span><span class="jsdoc-var">onResize </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
  50         </span><span class="jsdoc-var">Roo.form.Checkbox.superclass.onResize.apply</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">arguments</span><span class="jsdoc-syntax">);
  51         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.boxLabel</span><span class="jsdoc-syntax">){
  52             </span><span class="jsdoc-var">this.el.alignTo</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.wrap</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'c-c'</span><span class="jsdoc-syntax">);
  53         }
  54     },
  55
  56     </span><span class="jsdoc-var">initEvents </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
  57         </span><span class="jsdoc-var">Roo.form.Checkbox.superclass.initEvents.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
  58         </span><span class="jsdoc-var">this.el.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;click&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onClick</span><span class="jsdoc-syntax">,  </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
  59         </span><span class="jsdoc-var">this.el.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;change&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onClick</span><span class="jsdoc-syntax">,  </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
  60     },
  61
  62
  63     </span><span class="jsdoc-var">getResizeEl </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
  64         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.wrap</span><span class="jsdoc-syntax">;
  65     },
  66
  67     </span><span class="jsdoc-var">getPositionEl </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
  68         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.wrap</span><span class="jsdoc-syntax">;
  69     },
  70
  71
  72     </span><span class="jsdoc-comment">// private
  73     </span><span class="jsdoc-var">onRender </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ct</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">position</span><span class="jsdoc-syntax">){
  74         </span><span class="jsdoc-var">Roo.form.Checkbox.superclass.onRender.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">ct</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">position</span><span class="jsdoc-syntax">);
  75
  76         </span><span class="jsdoc-var">this.wrap </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.wrap</span><span class="jsdoc-syntax">({</span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'x-form-daypick-item '</span><span class="jsdoc-syntax">});
  77
  78         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">r1 </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'&lt;table&gt;&lt;tr&gt;'</span><span class="jsdoc-syntax">;
  79         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">r2 </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'&lt;tr class=&quot;x-form-daypick-icons&quot;&gt;'</span><span class="jsdoc-syntax">;
  80         </span><span class="jsdoc-keyword">for </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">=0; </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">&lt; 7; </span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">++) {
  81             </span><span class="jsdoc-var">r1</span><span class="jsdoc-syntax">+= </span><span class="jsdoc-string">'&lt;td&gt;&lt;div&gt;' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">Date.dayNames</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">]</span><span class="jsdoc-var">.substring</span><span class="jsdoc-syntax">(0,3) + </span><span class="jsdoc-string">'&lt;/div&gt;&lt;/td&gt;'</span><span class="jsdoc-syntax">;
  82             </span><span class="jsdoc-var">r2</span><span class="jsdoc-syntax">+= </span><span class="jsdoc-string">'&lt;td&gt;&lt;img class=&quot;x-menu-item-icon&quot; src=&quot;' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">Roo.BLANK_IMAGE_URL  </span><span class="jsdoc-syntax">+</span><span class="jsdoc-string">'&quot;&gt;&lt;/td&gt;'</span><span class="jsdoc-syntax">;
  83         }
  84
  85         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">viewEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.wrap.createChild</span><span class="jsdoc-syntax">( </span><span class="jsdoc-var">r1 </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">'&lt;/tr&gt;' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">r2 </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">'&lt;/tr&gt;&lt;/table&gt;'</span><span class="jsdoc-syntax">);
  86         </span><span class="jsdoc-var">viewEl.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'img'</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'click'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onClick</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
  87         </span><span class="jsdoc-var">this.viewEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">viewEl</span><span class="jsdoc-syntax">;
  88
  89
  90         </span><span class="jsdoc-comment">// this will not work on Chrome!!!
  91         </span><span class="jsdoc-var">this.el.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'DOMAttrModified'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.setFromHidden</span><span class="jsdoc-syntax">,  </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">); </span><span class="jsdoc-comment">//ff
  92         </span><span class="jsdoc-var">this.el.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'propertychange'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.setFromHidden</span><span class="jsdoc-syntax">,  </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);  </span><span class="jsdoc-comment">//ie
  93
  94
  95
  96
  97     </span><span class="jsdoc-syntax">},
  98
  99     </span><span class="jsdoc-comment">// private
 100     </span><span class="jsdoc-var">initValue </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">Roo.emptyFn</span><span class="jsdoc-syntax">,
 101
 102     </span><span class="jsdoc-comment">/**
 103      * Returns the checked state of the checkbox.
 104      * @return {Boolean} True if checked, else false
 105      */
 106     </span><span class="jsdoc-var">getValue </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 107         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.el.dom.value</span><span class="jsdoc-syntax">;
 108
 109     },
 110
 111         </span><span class="jsdoc-comment">// private
 112     </span><span class="jsdoc-var">onClick </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">){
 113         </span><span class="jsdoc-comment">//this.setChecked(!this.checked);
 114         </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e.target</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.toggleClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'x-menu-item-checked'</span><span class="jsdoc-syntax">);
 115         </span><span class="jsdoc-var">this.refreshValue</span><span class="jsdoc-syntax">();
 116         </span><span class="jsdoc-comment">//if(this.el.dom.checked != this.checked){
 117         //    this.setValue(this.el.dom.checked);
 118        // }
 119     </span><span class="jsdoc-syntax">},
 120
 121     </span><span class="jsdoc-comment">// private
 122     </span><span class="jsdoc-var">refreshValue </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 123     {
 124         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">val </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">;
 125         </span><span class="jsdoc-var">this.viewEl.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'img'</span><span class="jsdoc-syntax">,</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">n</span><span class="jsdoc-syntax">)  {
 126             </span><span class="jsdoc-var">val </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-var">e.is</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;.x-menu-item-checked&quot;</span><span class="jsdoc-syntax">) ? </span><span class="jsdoc-var">String</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">n</span><span class="jsdoc-syntax">) : </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">;
 127         });
 128         </span><span class="jsdoc-var">this.setValue</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">val</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
 129     },
 130
 131     </span><span class="jsdoc-comment">/**
 132      * Sets the checked state of the checkbox.
 133      * On is always based on a string comparison between inputValue and the param.
 134      * @param {Boolean/String} value - the value to set
 135      * @param {Boolean/String} suppressEvent - whether to suppress the checkchange event.
 136      */
 137     </span><span class="jsdoc-var">setValue </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">suppressEvent</span><span class="jsdoc-syntax">){
 138         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.el.dom</span><span class="jsdoc-syntax">) {
 139             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 140         }
 141         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">old </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.dom.value </span><span class="jsdoc-syntax">;
 142         </span><span class="jsdoc-var">this.el.dom.value </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">;
 143         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">suppressEvent</span><span class="jsdoc-syntax">) {
 144             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">;
 145         }
 146
 147         </span><span class="jsdoc-comment">// update display..
 148         </span><span class="jsdoc-var">this.viewEl.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'img'</span><span class="jsdoc-syntax">,</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">n</span><span class="jsdoc-syntax">)  {
 149
 150             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">on </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">e.is</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;.x-menu-item-checked&quot;</span><span class="jsdoc-syntax">);
 151             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">newv </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">v.indexOf</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">String</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">n</span><span class="jsdoc-syntax">)) &gt; -1;
 152             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">on </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-var">newv</span><span class="jsdoc-syntax">) {
 153                 </span><span class="jsdoc-var">e.toggleClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'x-menu-item-checked'</span><span class="jsdoc-syntax">);
 154             }
 155
 156         });
 157
 158
 159         </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'change'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">old</span><span class="jsdoc-syntax">);
 160
 161
 162     },
 163
 164     </span><span class="jsdoc-comment">// handle setting of hidden value by some other method!!?!?
 165     </span><span class="jsdoc-var">setFromHidden</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 166     {
 167         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.el</span><span class="jsdoc-syntax">){
 168             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 169         }
 170         </span><span class="jsdoc-comment">//console.log(&quot;SET FROM HIDDEN&quot;);
 171         //alert('setFrom hidden');
 172         </span><span class="jsdoc-var">this.setValue</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.el.dom.value</span><span class="jsdoc-syntax">);
 173     },
 174
 175     </span><span class="jsdoc-var">onDestroy </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 176     {
 177         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.viewEl</span><span class="jsdoc-syntax">){
 178             </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.viewEl</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.remove</span><span class="jsdoc-syntax">();
 179         }
 180
 181         </span><span class="jsdoc-var">Roo.form.DayPicker.superclass.onDestroy.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 182     }
 183
 184 });</span></code></body></html>