-<html><head><title>/home/alan/gitlive/roojs1/Roo/bootstrap/Input.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">/*
+<html><head><title>Roo/bootstrap/Input.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">/*
* - LGPL
*
* Input
* @extends Roo.bootstrap.Component
* Bootstrap Input class
* @cfg {Boolean} disabled is it disabled
- * @cfg {String} inputType button | checkbox | email | file | hidden | image | number | password | radio | range | reset | search | submit | text
+ * @cfg {String} inputType (button|checkbox|email|file|hidden|image|number|password|radio|range|reset|search|submit|text)
* @cfg {String} name name of the input
* @cfg {string} fieldLabel - the label associated
* @cfg {string} placeholder - placeholder to put in text.
- * @cfg {string} before - input group add on before
+ * @cfg {string} before - input group add on before
* @cfg {string} after - input group add on after
* @cfg {string} size - (lg|sm) or leave empty..
* @cfg {Number} xs colspan out of 12 for mobile-sized screens
* @cfg {String} indicatorpos (left|right) default left
* @cfg {String} capture (user|camera) use for file input only. (default empty)
* @cfg {String} accept (image|video|audio) use for file input only. (default empty)
-
+ * @cfg {Boolean} preventMark Do not show tick or cross if error/success
+ * @cfg {Roo.bootstrap.Button} before Button to show before
+ * @cfg {Roo.bootstrap.Button} afterButton to show before
* @cfg {String} align (left|center|right) Default left
* @cfg {Boolean} forceFeedback (true|false) Default false
*
* @param {Roo.form.Field} this
* @param {Roo.EventObject} e The event Object
*/
- </span><span class="jsdoc-var">keyup </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true
+ </span><span class="jsdoc-var">keyup </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
+ </span><span class="jsdoc-comment">/**
+ * @event paste
+ * Fires after the user pastes into input
+ * @param {Roo.form.Field} this
+ * @param {Roo.EventObject} e The event Object
+ */
+ </span><span class="jsdoc-var">paste </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true
</span><span class="jsdoc-syntax">});
};
</span><span class="jsdoc-var">placeholder </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.placeholder </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">,
</span><span class="jsdoc-var">autocomplete </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.autocomplete </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-string">'new-password'
</span><span class="jsdoc-syntax">};
+ </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.inputType </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'file'</span><span class="jsdoc-syntax">) {
+ </span><span class="jsdoc-var">input.style </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'overflow:hidden'</span><span class="jsdoc-syntax">; </span><span class="jsdoc-comment">// why not in CSS?
+ </span><span class="jsdoc-syntax">}
</span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.capture.length</span><span class="jsdoc-syntax">){
</span><span class="jsdoc-var">input.capture </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.capture</span><span class="jsdoc-syntax">;
</span><span class="jsdoc-var">inputblock.cn.push</span><span class="jsdoc-syntax">({
</span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">:</span><span class="jsdoc-string">'span'</span><span class="jsdoc-syntax">,
- </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'roo-input-before input-group-prepend input-group-text input-group-' </span><span class="jsdoc-syntax">+
+ </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'roo-input-before input-group-prepend input-group-' </span><span class="jsdoc-syntax">+
(</span><span class="jsdoc-var">this.before.xtype </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'Button' </span><span class="jsdoc-syntax">? </span><span class="jsdoc-string">'btn' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'addon'</span><span class="jsdoc-syntax">) </span><span class="jsdoc-comment">//?? what about checkboxes - that looks like a bit of a hack thought?
</span><span class="jsdoc-syntax">});
}
</span><span class="jsdoc-var">inputblock.cn.push</span><span class="jsdoc-syntax">({
</span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">:</span><span class="jsdoc-string">'span'</span><span class="jsdoc-syntax">,
- </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'roo-input-after input-group-append input-group-text input-group-' </span><span class="jsdoc-syntax">+
+ </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'roo-input-after input-group-append input-group-' </span><span class="jsdoc-syntax">+
(</span><span class="jsdoc-var">this.after.xtype </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'Button' </span><span class="jsdoc-syntax">? </span><span class="jsdoc-string">'btn' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'addon'</span><span class="jsdoc-syntax">) </span><span class="jsdoc-comment">//?? what about checkboxes - that looks like a bit of a hack thought?
</span><span class="jsdoc-syntax">});
}
</span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'roo-required-indicator ' </span><span class="jsdoc-syntax">+ (</span><span class="jsdoc-var">this.indicatorpos </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'right' </span><span class="jsdoc-syntax">? </span><span class="jsdoc-string">'right' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'left'</span><span class="jsdoc-syntax">) +</span><span class="jsdoc-string">'-indicator text-danger fa fa-lg fa-star'</span><span class="jsdoc-syntax">,
</span><span class="jsdoc-var">tooltip </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'This field is required'
</span><span class="jsdoc-syntax">};
- </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.bootstrap.version </span><span class="jsdoc-syntax">== 4) {
- </span><span class="jsdoc-var">indicator </span><span class="jsdoc-syntax">= {
- </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'i'</span><span class="jsdoc-syntax">,
- </span><span class="jsdoc-var">style </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'display-none'
- </span><span class="jsdoc-syntax">};
+ </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.allowBlank </span><span class="jsdoc-syntax">) {
+ </span><span class="jsdoc-var">indicator.style </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.allowBlank </span><span class="jsdoc-syntax">? </span><span class="jsdoc-string">' display:none' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">;
}
</span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">align </span><span class="jsdoc-syntax">===</span><span class="jsdoc-string">'left' </span><span class="jsdoc-syntax">&& </span><span class="jsdoc-var">this.fieldLabel.length</span><span class="jsdoc-syntax">) {
}
</span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.labelWidth </span><span class="jsdoc-syntax">< 13 && </span><span class="jsdoc-var">this.labelmd </span><span class="jsdoc-syntax">== 0){
- </span><span class="jsdoc-var">this.labelmd </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.labelWidth</span><span class="jsdoc-syntax">;
+ </span><span class="jsdoc-var">this.labellg </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.labellg </span><span class="jsdoc-syntax">> 0 ? </span><span class="jsdoc-var">this.labellg </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.labelWidth</span><span class="jsdoc-syntax">;
}
</span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.labellg </span><span class="jsdoc-syntax">> 0){
} </span><span class="jsdoc-keyword">else if </span><span class="jsdoc-syntax">( </span><span class="jsdoc-var">this.fieldLabel.length</span><span class="jsdoc-syntax">) {
+
+
</span><span class="jsdoc-var">cfg.cn </span><span class="jsdoc-syntax">= [
{
</span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'i'</span><span class="jsdoc-syntax">,
</span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'roo-required-indicator left-indicator text-danger fa fa-lg fa-star'</span><span class="jsdoc-syntax">,
- </span><span class="jsdoc-var">tooltip </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'This field is required'
+ </span><span class="jsdoc-var">tooltip </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'This field is required'</span><span class="jsdoc-syntax">,
+ </span><span class="jsdoc-var">style </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.allowBlank </span><span class="jsdoc-syntax">? </span><span class="jsdoc-string">' display:none' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''
</span><span class="jsdoc-syntax">},
{
</span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'label'</span><span class="jsdoc-syntax">,
{
</span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'i'</span><span class="jsdoc-syntax">,
</span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'roo-required-indicator right-indicator text-danger fa fa-lg fa-star'</span><span class="jsdoc-syntax">,
- </span><span class="jsdoc-var">tooltip </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'This field is required'
+ </span><span class="jsdoc-var">tooltip </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'This field is required'</span><span class="jsdoc-syntax">,
+ </span><span class="jsdoc-var">style </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.allowBlank </span><span class="jsdoc-syntax">? </span><span class="jsdoc-string">' display:none' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''
</span><span class="jsdoc-syntax">},
</span><span class="jsdoc-var">inputblock
</span><span class="jsdoc-var">this.inputEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">"blur"</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onBlur</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
</span><span class="jsdoc-var">this.inputEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.relayEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'keyup'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
+ </span><span class="jsdoc-var">this.inputEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.relayEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'paste'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
</span><span class="jsdoc-var">this.indicator </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.indicatorEl</span><span class="jsdoc-syntax">();
</span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
}
+
</span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.allowBlank </span><span class="jsdoc-syntax">&& !</span><span class="jsdoc-var">this.getRawValue</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.length</span><span class="jsdoc-syntax">){
</span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
}