How to auto close the previous 'virtual-keyboard' upon opening a new one.

[mjosephdelrosario]

I am having a problem of overlapping 'virtual-keyboard's when clicking multiple input-types without closing the previous ones -- how could i auto close it?

[the-darc]

It is a bug in the api. I would investigate it soon. Still, pull requests are welcome!

[mjosephdelrosario]

Great plugin port! Btw, for the issue above, i just used lodash and angular's jqlite for fixing it(within self.attachVki() function). But also looking for forward for the official fix.

    VKI_addListener(elem, 'click', function(e) {
      if (self.VKI_target == this) {
          e = e || event;
          if (e.stopPropagation) { e.stopPropagation(); } else e.cancelBubble = true;
          // For triggering close to non-focused virtual keyboard elements
          angular.forEach( angular.element(document).find('input'), function(value) {
              var inputChild = angular.element(value);
              if(_.isEqual('true', inputChild.attr('VKI_attached')) && !_.isEqual(elem, value)) {
                  inputChild.triggerHandler('close');
              }
          });
      }
      return false;
    }, false);
    if (self.VKI_isMoz)
      elem.addEventListener('blur', function() { this.setAttribute('_scrollTop', this.scrollTop); }, false);
    // Attach close event handler.
    angular.element(elem).bind('close', function(){ self.VKI_close(); });
    VKI_addListener(document.documentElement, 'click', function(e) { self.VKI_close(); }, false);

Added these:

          // For finding all input type elements with attached VKI
          angular.forEach( angular.element(document).find('input'), function(value) {
              var inputChild = angular.element(value);
              if(_.isEqual('true', inputChild.attr('VKI_attached')) && !_.isEqual(elem, value)) {
                  inputChild.triggerHandler('close');
              }
          });

           // For attaching a close event handler
           angular.element(elem).bind('close', function(){ self.VKI_close(); });

[pspk]

Thank you havocdrake!

I am using textarea widgets with the virtual keyboard - so I added one more angular.foreach to detach keyboards from the textarea widgets:

      angular.forEach( angular.element(document).find('textarea'), function(value) {
          var inputChild = angular.element(value);
          if(_.isEqual('true', inputChild.attr('VKI_attached')) && !_.isEqual(elem, value)) {
              inputChild.triggerHandler('close');
          }
      });

[mjosephdelrosario]

Note this is not the official fix -- But I am glad that those hack-fix could help :>

[luiscarlosjayk]

At line 241

VKI_addListener(document.documentElement, 'click', function(e) { self.VKI_close(); }, false);

The close function is being called when clicked on blank space in the page. But not if clicked on another input or other elements that could take focus too e.g. labels.

[JinlingLi]

Add a listener for blur event as well?: VKI_addListener(elem, 'blur', function(e) { if (self.VKItarget == this) { e = e || event; if (e.stopPropagation) { e.stopPropagation(); } else e.cancelBubble = true; // For triggering close to non-focused virtual keyboard elements angular.forEach( angular.element(document).find('input'), function(value) { var inputChild = angular.element(value); if(.isEqual('true', inputChild.attr('VKIattached')) && !.isEqual(elem, value)) { inputChild.triggerHandler('close'); } }); } return false; }, false);

[the-darc]

solved in version 0.4.2

[luiscarlosjayk]

I downloaded version 0.4.2 and issue still happens. (using chrome) and I also get an error: Uncaught RangeError: Maximum call stack size exceeded

[the-darc]

@Ciul, the demo page is using version 0.4.2 and testing it on my chrome (v44.0.2403.125 (64-bit)) the issue appears to be solved. Could you be more specific about where you found the Maximum call stack error?