I have an application built with the:
Cordova CLI: 5.0.0
Gulp version: CLI version 3.8.11
Gulp local: Local version 3.8.11
Ionic Version: 1.0.0
Ionic CLI Version: 1.5.0
Ionic App Lib Version: 0.1.0
There is a simple form inside it:
<form name="forms.contactForm" novalidate>
<label class="item item-input">
<input type="text"
placeholder="Email"
name="email"
ng-model="data.email"
validator="required">
</label>
<label class="item item-input">
<textarea rows="5"
placeholder="Notes"
name="notes"
ng-model="data.notes"></textarea>
</label>
</form>
When there is some data inside input element and I click on it, cursor moves to the end of it (like it should), but in textarea it depends where I click. If I click on the same row where text is located (on the white space just after it), cursor moves to start, but if I click on next row it moves to end
I've tried this solution http://davidwalsh.name/caret-end to move cursor to end, but it doesn't work. Cursor still moves to start
UPDATE:
That is how I've implemented David's solution:
caret-to-end.js (directive)
var caretToEnd = function () {
return {
restriction: 'A',
controller: function ($scope) {
$scope.caretToEnd = function (formName, elementName) {
var e = document.forms[formName].elements[elementName];
if (typeof e.selectionStart == "number") {
e.selectionStart = e.selectionEnd = e.value.length;
} else if (typeof e.createTextRange != "undefined") {
e.focus();
var range = e.createTextRange();
range.collapse(false);
range.select();
}
}
}
}
};
caretToEnd.$inject = [];
app.directive('caretToEnd', caretToEnd);
contactForm.html
<form name="forms.contactForm" caret-to-end novalidate>
...
<label class="item item-input">
<textarea rows="5"
placeholder="Notes"
name="notes"
ng-model="data.notes"
ng-click="caretToEnd('forms.orderForm','notes')"></textarea>
</label>
</form>
I've logged some values from that function. Everything seems to be correct, but cursor still doesn't go to end