Search code examples
javascriptjqueryangularjsselection-api

add text to an input type email angular jquery


I am trying to add text to input type email without success here is how I am trying to do it

 $scope.lastFocused;
  angular.element("input[type='text'], input[type='url'], input[type='email'], input[type='password'], input[type='search'], input[type='tel'], textarea").focus(function() {

    $scope.lastFocused = document.activeElement;
  });

  $scope.insertText = function(text) {
    var input = $scope.lastFocused;
    console.log(input);
    if (input == undefined) { return; }
    var scrollPos = input.scrollTop;
    var pos = input.selectionStart;
    var front = (input.value).substring(0, pos);  
    var back = (input.value).substring(pos, input.value.length); 
    input.value = front+text+back;
    pos = pos + text.length;

    input.scrollTop = scrollPos;
    console.log(angular.element(input).val());
    angular.element(input).trigger('input');

 };

I think the problem has to do with the fact that I am trying to trigger an input of type text and email does not support input.selectionStart;. I get the error

Failed to read the 'selectionStart' property from 'HTMLInputElement': The input element's type ('email') does not support selection.

and for some reason email will not accept a value.

I am using chrome only. any workarounds would be apreciated


Solution

  • Here is a link to the answer of another post with the same exact type of question as you:

    https://stackoverflow.com/a/21959157/6032583

    It looks like you are going to need to find another way because 'selectionStart' is not supported by an input of type email.