blurActive messing with focus() on click

ionic-v1
1

Hi !

The ionic tap module contains a function called blurActive, that blurs the document’s active element when a click is detected under certain circumstances.

I experienced problems with some of my input tags and I think the problem was caused by this piece of code in particular:

if(ele.tagName === 'INPUT' || ele.tagName === 'TEXTAREA') {
      ele.focus();
      e.preventDefault();
    } else {
      blurActive();
    }

Within my form labels, I added buttons that allow the user to clear the input, as can be seen in many apps.

<label class="item item-input">
  <input type="email" name="email" placeholder="Email Address" ng-model="user.email">
  <button class="button-icon ion-close-circled" ng-click="clearInput();" type="button"></button>
</label>

When the user clicks on the clear button, I expect to retain focus on the input. I do so by doing a focus() on my input tag, inside my clearInput() function.

However, the ionic code shown above apparently runs after clearInput has been executed. Because of that, focus on input tags is lost when a user clicks on a clear button, and the keyboard goes away.

For now, I’ve solved the problem by just removing blurActive altogether from ionic.js… Could someone confirm this issue?

I tried with and without ngTouch/FastClick. I use ionic1.0.0-beta.1

Thanks!

2

Hi.

I am having the exact same problem. I have a button that clears the input of an input. When I do this the input clears, the soft keyboard goes away and the input no longer has focus!

Did you solve the problem? I’m using v1.0.0-rc.1

Thanks
Jason

3

Jason again:

My code looks like this:

<div class="item item-input">
   <input type="text" required name="username" ng-model="formData.username"
      placeholder="User Name">
    <i  class="icon ion-close" ng-model="formData.username"
      ng-click="formData.username = ''"></i>
</div>