Keyboard not working with Chosen dropdown

[andre-lima]

Hello,

I can't seem to make the virtual keyboard work with a Chosen multiselect dropdown.

I've checked this answer on SO by @Mottie, but this solution didn't work for me. https://stackoverflow.com/questions/29298356/mottie-virtual-keyboard-and-chosen-selector

Please let me know if there's something that can be done.

Thank you

[Mottie]

Hi @andre-lima!

I don't think I've ever created a demo for this keyboard to be used with chosen... I'll take a look this weekend, if I get some time.

[cortexrd]

We have the same problem. Can't wait for a solution... Knack uses this object everywhere and we really like your virtual keyboard, but we must find a way to use it with the filtered drop-down object.

[Mottie]

It's not perfect, but this method should work for the default settings.

I didn't test this on multi-selects or other chosen settings (demo):

$(function() {
  $("select")
    .on("chosen:ready", function(e, obj) {
      obj.chosen.search_container
        .find("input")
        .keyboard({
          // Used by jQuery UI position utility
          position: {
            // null = attach to input/textarea;
            // use $(sel) to attach elsewhere
            of: $(document),
            my: "center bottom",
            at: "center bottom",
            // used when "usePreview" is false
            at2: "center bottom"
          },
          reposition: true,
          usePreview: false,
          change: function(e, keyboard, el) {
            keyboard.$el.trigger("keyup.chosen");
            // attempt to keep the chosen dropdown from closing when
            // you click on the keyboard container instead of a key
            obj.chosen.mouse_on_container = true;
          }
        })
        .addTyping({
          showTyping: true,
          delay: 250
        });
    })
    .chosen();
});

[andre-lima]

Thank you. It's a lot better than before, but if I add another dropdown, I have to tab twice to make the second one open. Do you know if there's a fix for this?

[Mottie]

Do you have the tabNavigation option set as true? I tried setting that and I could only use tab once, and the select lost focus and closed the keyboard (demo). If you want to get tabs to work, you'll probably need to modify the switchInput callback to change the behavior.