javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-18 19:21:34 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(scroll): fix JS error when scrolling text input

Browse Source
This commit is contained in:
Adam Bradley
2015-11-16 16:35:59 -06:00
parent df3a59dc81
commit 3ec39c51b5
4 changed files with 110 additions and 84 deletions
Download Patch File Download Diff File Expand all files Collapse all files

59
ionic/components/text-input/text-input.ts
View File

@ -87,7 +87,7 @@ export class TextInput {
self.deregListeners();
if (self.hasFocus) {
//self.input.hideFocus();
}
};
}
@ -315,6 +315,9 @@ export class TextInput {
*/
focusChange(hasFocus) {
this.renderer.setElementClass(this.elementRef, 'has-focus', hasFocus);
if (!hasFocus) {
this.deregListeners();
}
}
/**
@ -419,34 +422,46 @@ export class TextInputElement {
}
relocate(shouldRelocate, inputRelativeY) {
this.clone(shouldRelocate, inputRelativeY);
if (this._relocated !== shouldRelocate) {
if (shouldRelocate) {
this.wrapper.setFocus();
let focusedInputEle = this.getNativeElement();
if (shouldRelocate) {
let clonedInputEle = focusedInputEle.cloneNode(true);
clonedInputEle.classList.add('cloned-input');
clonedInputEle.setAttribute('aria-hidden', true);
clonedInputEle.tabIndex = -1;
focusedInputEle.parentNode.insertBefore(clonedInputEle, focusedInputEle);
focusedInputEle.classList.add('hide-focused-input');
focusedInputEle.style[dom.CSS.transform] = `translate3d(-9999px,${inputRelativeY}px,0)`;
this.wrapper.setFocus();
} else {
focusedInputEle.classList.remove('hide-focused-input');
focusedInputEle.style[dom.CSS.transform] = '';
let clonedInputEle = focusedInputEle.parentNode.querySelector('.cloned-input');
if (clonedInputEle) {
clonedInputEle.parentNode.removeChild(clonedInputEle);
}
}
this._relocated = shouldRelocate;
}
}
clone(shouldClone, inputRelativeY) {
hideFocus() {
console.debug('hideFocus');
let focusedInputEle = this.getNativeElement();
if (shouldRelocate) {
let clonedInputEle = focusedInputEle.cloneNode(true);
clonedInputEle.classList.add('cloned-input');
clonedInputEle.setAttribute('aria-hidden', true);
clonedInputEle.tabIndex = -1;
focusedInputEle.classList.add('hide-focused-input');
focusedInputEle.style[dom.CSS.transform] = `translate3d(-9999px,${inputRelativeY}px,0)`;
focusedInputEle.parentNode.insertBefore(clonedInputEle, focusedInputEle);
} else {
focusedInputEle.classList.remove('hide-focused-input');
focusedInputEle.style[dom.CSS.transform] = '';
let clonedInputEle = focusedInputEle.parentNode.querySelector('.cloned-input');
if (clonedInputEle) {
clonedInputEle.parentNode.removeChild(clonedInputEle);
}
let hiddenInputEle = focusedInputEle.parentNode.querySelector('.cloned-hidden');
if (!hiddenInputEle) {
hiddenInputEle = focusedInputEle.cloneNode(true);
hiddenInputEle.classList.add('cloned-hidden');
hiddenInputEle.setAttribute('aria-hidden', true);
hiddenInputEle.tabIndex = -1;
focusedInputEle.parentNode.appendChild(hiddenInputEle);
}
hiddenInputEle.focus();
}
get hasFocus() {