InputFieldBtnPassword
This commit is contained in:
parent
c251fc32d2
commit
0bd8cf3fc9
|
@ -560,85 +560,111 @@ define([
|
||||||
validateOnBlur: true,
|
validateOnBlur: true,
|
||||||
disabled: false,
|
disabled: false,
|
||||||
editable: true,
|
editable: true,
|
||||||
iconCls: 'btn-select-range',
|
iconCls: 'hide-password',
|
||||||
btnHint: ''
|
btnHint: '',
|
||||||
|
repeatInput: null,
|
||||||
|
showPwdOnClick: false
|
||||||
},
|
},
|
||||||
render : function(parentEl) {
|
|
||||||
|
|
||||||
|
render : function(parentEl) {
|
||||||
|
|
||||||
if (!this.rendered) {
|
if (!this.rendered) {
|
||||||
this.cmpEl = $(this.template({
|
this.cmpEl = $(this.template({
|
||||||
id : this.id,
|
id : this.id,
|
||||||
cls : this.cls,
|
cls : this.cls,
|
||||||
style : this.style,
|
style : this.style,
|
||||||
value : this.value,
|
value : this.value,
|
||||||
type : 'password',
|
type : 'password',
|
||||||
name : this.name,
|
name : this.name,
|
||||||
placeHolder : this.placeHolder,
|
placeHolder : this.placeHolder,
|
||||||
spellcheck : this.spellcheck,
|
spellcheck : this.spellcheck,
|
||||||
iconCls : this.options.iconCls,
|
iconCls : 'hide-password',
|
||||||
scope : this
|
scope : this
|
||||||
}));
|
}));
|
||||||
|
|
||||||
if (parentEl) {
|
if (parentEl) {
|
||||||
this.setElement(parentEl, false);
|
this.setElement(parentEl, false);
|
||||||
parentEl.html(this.cmpEl);
|
parentEl.html(this.cmpEl);
|
||||||
|
} else {
|
||||||
|
this.$el.html(this.cmpEl);
|
||||||
|
}
|
||||||
} else {
|
} else {
|
||||||
this.$el.html(this.cmpEl);
|
this.cmpEl = this.$el;
|
||||||
}
|
|
||||||
} else {
|
|
||||||
this.cmpEl = this.$el;
|
|
||||||
}
|
|
||||||
|
|
||||||
if (!this.rendered) {
|
|
||||||
var el = this.cmpEl;
|
|
||||||
|
|
||||||
this._btnElm = this.cmpEl.find('button');
|
|
||||||
this._button = new Common.UI.Button({
|
|
||||||
el: this._button,
|
|
||||||
hint: this.options.btnHint || ''
|
|
||||||
});
|
|
||||||
this._button.on('click', _.bind(this.onButtonClick, this));
|
|
||||||
this._btnElm.on('mousedown', _.bind(this.onMouseDown, this));
|
|
||||||
|
|
||||||
this._input = this.cmpEl.find('input').addBack().filter('input');
|
|
||||||
if (this.editable) {
|
|
||||||
this._input.on('blur', _.bind(this.onInputChanged, this));
|
|
||||||
this._input.on('keypress', _.bind(this.onKeyPress, this));
|
|
||||||
this._input.on('keydown', _.bind(this.onKeyDown, this));
|
|
||||||
this._input.on('keyup', _.bind(this.onKeyUp, this));
|
|
||||||
if (this.validateOnChange) this._input.on('input', _.bind(this.onInputChanging, this));
|
|
||||||
if (this.maxLength) this._input.attr('maxlength', this.maxLength);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (!this.rendered) {
|
||||||
|
var el = this.cmpEl;
|
||||||
|
|
||||||
this.setEditable(this.editable);
|
this._btnElm = this.cmpEl.find('button');
|
||||||
|
this._button = new Common.UI.Button({
|
||||||
|
el: this._btnElm,
|
||||||
|
hint: this.options.btnHint || ''
|
||||||
|
});
|
||||||
|
this._button.setIconCls('hide-password');
|
||||||
|
this._button.on('click', _.bind(this.onButtonClick, this));
|
||||||
|
if(this.options.showPwdOnClick)
|
||||||
|
this._button.on('click', _.bind(this.passwordShow, this));
|
||||||
|
else
|
||||||
|
this._btnElm.on('mousedown', _.bind(this.passwordShow, this));
|
||||||
|
|
||||||
if (this.disabled)
|
this._input = this.cmpEl.find('input').addBack().filter('input');
|
||||||
this.setDisabled(this.disabled);
|
if (this.editable) {
|
||||||
|
this._input.on('blur', _.bind(this.onInputChanged, this));
|
||||||
|
this._input.on('keypress', _.bind(this.onKeyPress, this));
|
||||||
|
this._input.on('keydown', _.bind(this.onKeyDown, this));
|
||||||
|
this._input.on('keyup', _.bind(this.onKeyUp, this));
|
||||||
|
if (this.validateOnChange) this._input.on('input', _.bind(this.onInputChanging, this));
|
||||||
|
if (this.maxLength) this._input.attr('maxlength', this.maxLength);
|
||||||
|
}
|
||||||
|
|
||||||
if (this._input.closest('.asc-window').length>0)
|
|
||||||
var onModalClose = function() {
|
|
||||||
var errorTip = el.find('.input-error').data('bs.tooltip');
|
|
||||||
if (errorTip) errorTip.tip().remove();
|
|
||||||
Common.NotificationCenter.off({'modal:close': onModalClose});
|
|
||||||
};
|
|
||||||
Common.NotificationCenter.on({'modal:close': onModalClose});
|
|
||||||
}
|
|
||||||
this.rendered = true;
|
|
||||||
|
|
||||||
return this;
|
this.setEditable(this.editable);
|
||||||
|
|
||||||
|
if (this.disabled)
|
||||||
|
this.setDisabled(this.disabled);
|
||||||
|
|
||||||
|
if (this._input.closest('.asc-window').length>0)
|
||||||
|
var onModalClose = function() {
|
||||||
|
var errorTip = el.find('.input-error').data('bs.tooltip');
|
||||||
|
if (errorTip) errorTip.tip().remove();
|
||||||
|
Common.NotificationCenter.off({'modal:close': onModalClose});
|
||||||
|
};
|
||||||
|
Common.NotificationCenter.on({'modal:close': onModalClose});
|
||||||
|
}
|
||||||
|
this.rendered = true;
|
||||||
|
|
||||||
|
return this;
|
||||||
},
|
},
|
||||||
|
|
||||||
onMouseDown: function (e) {
|
passwordShow: function (e) {
|
||||||
if ((this._input.val() == '')||(this.disabled)) return;
|
if (this.disabled) return;
|
||||||
this._btnElm.on('mouseup', _.bind(this.onMouseUp,this));
|
this._button.setIconCls('btn-sheet-view');
|
||||||
this._input.attr('type', 'text');
|
this._input.attr('type', 'text');
|
||||||
|
if(this.options.repeatInput)
|
||||||
|
this.options.repeatInput.attr('type', 'text');
|
||||||
|
|
||||||
|
if(this.options.showPwdOnClick)
|
||||||
|
{
|
||||||
|
this._button.off('click', _.bind(this.passwordShow, this));
|
||||||
|
this._button.on('click', _.bind(this.passwordHide, this));
|
||||||
|
}
|
||||||
|
else
|
||||||
|
this._btnElm.on('mouseup', _.bind(this.passwordHide,this));
|
||||||
},
|
},
|
||||||
|
|
||||||
onMouseUp: function (e) {
|
passwordHide: function (e) {
|
||||||
|
this._button.setIconCls('hide-password');
|
||||||
this._input.attr('type', 'password');
|
this._input.attr('type', 'password');
|
||||||
this._btnElm.off('mouseup', this.onMouseUp);
|
if(this.options.repeatInput)
|
||||||
|
this.options.repeatInput.attr('type', 'password');
|
||||||
|
|
||||||
|
if(this.options.showPwdOnClick)
|
||||||
|
{
|
||||||
|
this._button.off('click', _.bind(this.passwordHide, this));
|
||||||
|
this._button.on('click', _.bind(this.passwordShow, this));
|
||||||
|
}
|
||||||
|
else
|
||||||
|
this._btnElm.off('mouseup', this.passwordHide);
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
|
@ -200,7 +200,7 @@ define([
|
||||||
this.previewInner = this.previewScrolled.find('div:first-child');
|
this.previewInner = this.previewScrolled.find('div:first-child');
|
||||||
|
|
||||||
if (this.type == Common.Utils.importTextType.DRM) {
|
if (this.type == Common.Utils.importTextType.DRM) {
|
||||||
this.inputPwd = new Common.UI.InputField({
|
this.inputPwd = new Common.UI.InputFieldBtnPassword({
|
||||||
el: $('#id-password-txt'),
|
el: $('#id-password-txt'),
|
||||||
type: 'password',
|
type: 'password',
|
||||||
validateOnBlur: false,
|
validateOnBlur: false,
|
||||||
|
|
|
@ -93,14 +93,7 @@ define([
|
||||||
if (this.$window) {
|
if (this.$window) {
|
||||||
var me = this;
|
var me = this;
|
||||||
this.$window.find('.dlg-btn').on('click', _.bind(this.onBtnClick, this));
|
this.$window.find('.dlg-btn').on('click', _.bind(this.onBtnClick, this));
|
||||||
this.inputPwd = new Common.UI.InputField({
|
|
||||||
el: $('#id-password-txt'),
|
|
||||||
type: 'password',
|
|
||||||
allowBlank : false,
|
|
||||||
style : 'width: 100%;',
|
|
||||||
maxLength: 255,
|
|
||||||
validateOnBlur: false
|
|
||||||
});
|
|
||||||
this.repeatPwd = new Common.UI.InputField({
|
this.repeatPwd = new Common.UI.InputField({
|
||||||
el: $('#id-repeat-txt'),
|
el: $('#id-repeat-txt'),
|
||||||
type: 'password',
|
type: 'password',
|
||||||
|
@ -112,6 +105,16 @@ define([
|
||||||
return me.txtIncorrectPwd;
|
return me.txtIncorrectPwd;
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
this.inputPwd = new Common.UI.InputFieldBtnPassword({
|
||||||
|
el: $('#id-password-txt'),
|
||||||
|
type: 'password',
|
||||||
|
allowBlank : false,
|
||||||
|
style : 'width: 100%;',
|
||||||
|
maxLength: 255,
|
||||||
|
validateOnBlur: false,
|
||||||
|
repeatInput: this.repeatPwd._input,
|
||||||
|
showPwdOnClick: true
|
||||||
|
});
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
|
|
|
@ -111,14 +111,7 @@ define([
|
||||||
|
|
||||||
var me = this;
|
var me = this;
|
||||||
this.$window.find('.dlg-btn').on('click', _.bind(this.onBtnClick, this));
|
this.$window.find('.dlg-btn').on('click', _.bind(this.onBtnClick, this));
|
||||||
this.inputPwd = new Common.UI.InputField({
|
|
||||||
el: $('#id-password-txt'),
|
|
||||||
type: 'password',
|
|
||||||
allowBlank : true,
|
|
||||||
style : 'width: 100%;',
|
|
||||||
maxLength: 255,
|
|
||||||
validateOnBlur: false
|
|
||||||
});
|
|
||||||
this.repeatPwd = new Common.UI.InputField({
|
this.repeatPwd = new Common.UI.InputField({
|
||||||
el: $('#id-repeat-txt'),
|
el: $('#id-repeat-txt'),
|
||||||
type: 'password',
|
type: 'password',
|
||||||
|
@ -130,6 +123,15 @@ define([
|
||||||
return me.txtIncorrectPwd;
|
return me.txtIncorrectPwd;
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
this.inputPwd = new Common.UI.InputFieldBtnPassword({
|
||||||
|
el: $('#id-password-txt'),
|
||||||
|
type: 'password',
|
||||||
|
allowBlank : true,
|
||||||
|
style : 'width: 100%;',
|
||||||
|
maxLength: 255,
|
||||||
|
validateOnBlur: false,
|
||||||
|
repeatInput: this.repeatPwd._input
|
||||||
|
});
|
||||||
|
|
||||||
if (this.type == 'sheet') {
|
if (this.type == 'sheet') {
|
||||||
this.optionsList = new Common.UI.ListView({
|
this.optionsList = new Common.UI.ListView({
|
||||||
|
|
Loading…
Reference in a new issue