xdan / autocomplete

jQuery autocomplete plugin like Google autocomplete
MIT License
256 stars 92 forks source link

Multiple (and dynamically added) autocomplete fields? #13

Closed cibulka closed 9 years ago

cibulka commented 9 years ago

Thanks for an awesome plugin!

I have a form, where user can dynamically add new fields and group of fields. For better understanding, here is the screenshot of UI:

screen shot 2015-06-07 at 1 13 39 pm

If user clicks the blueish "Add more" button, the group of fields gets cloned and user can add more values.

Everything works for me this way - even another of your awesome plugins, xdan/datetimepicker - but Autocomplete does not. Here is my configuration script:

jQuery(function($) {

    'use strict';

    function init($autocomplete) {

        var config  = $.parseJSON($autocomplete.attr('data-autocomplete'));

        $autocomplete.autocomplete(config);

    }

    $(document).on('ready cibulka/clone', function() {

        var $autocompletes = $('.cibm-input--autocomplete');

        $autocompletes.each(function() {

            var $autocomplete = $(this);
            init($autocomplete);

        });

    });

});

cibulka/clone is my custom event that gets triggered whenever user adds or removes field (or group of fields).

First autocomplete field always works (as shown in the screenshot), any other one does not. Firebug shows, that div.xdsoft_autocomplete gets printed below the field, but nothing is popping out when you type anything to the input.

Is it possible to make it work somehow? Or is my configuration flawed? Thank you in advance!

cibulka commented 9 years ago

It seems that I had an issue with duplicate IDs. Sorry for the noise & closing the issue!