Programmatically clicked multiple keyboards on same web page

[toketeeman]

In a previous issue (#156), I mentioned how to programmatically click a button in a visible keyboard. An example is shown below where a key will insert a "3" into the preview:

$("[ data-value='3' ]").trigger("mousedown.keyboard");

This works fine - for just one keyboard - the first one I access - on the page.

But what happens if I then close my initial keyboard and then reveal another similar one on the SAME page that also has a key with the attribute data-value='3' (that is, the respective keys of the two keyboards share the same attributes and values), and then re-apply the code above to click that second keyboard?

I would have thought this to be reasonable since the first keyboard's key buttons have been removed from the DOM and the second keyboard's key buttons have now been inserted into the DOM.

However, the trigger exceptions with the message below:

Object function (a){return p.access(this,function(a){return a===b? p.text(this):this.empty().append((this[0]&&this[0].ownerDocument||e).createTextNode(a))},null,a,arguments.length has no method 'replace'

I tracked this to apparently be inside of the jQuery.fn.extend() implementation. And I do happen to use $.extend($.keyboard.keyaction, ... ) for the concerned keys.

So the FIRST access of ANY keyboard for programmatic clicking on a page works fine. This problem occurs only when moving on to subsequently access other keyboards on the SAME page.

I am about to switch to try using the name attribute instead with unique key names for all the keyboards, but would like to avoid that if possible. Also, I'm still using version 1.16 ...

Any suggestions for an oversight or a fix? Thanks for any help.

[Mottie]

Well, the keyboard, once built and made visible, remains in the DOM. So the best solution I can think of is to make sure the keyboard is visible. Try this:

$("[ data-value='3' ]:visible").trigger("mousedown.keyboard");

[toketeeman]

Thank you. THAT worked! There's nothing like fresh eyes ...

I already have had my visibility guards in place and working (i.e. checking $("#MytextBox").getkeyboard().isVisible), but there is apparently some subtle jQuery difference in using visibility right in the selector.

It is a pleasure to close this issue.