flexdatalist on the fly

[Elodrin]

Hi, many thanks for this wunderful plugin. It looks really attractive and I like the customizable funktions. Unfortunately I cannot find a trigger function or something like that to add the flexdatalist to an input field which I would like to creat on the fly by jQuery. e.g.

<div id="wrapper">
<input placeholder='Artikel Name'
       class='flexdatalist'
       data-min-length='1'
       list='languages'
       name='products[]'
       type='text'>
</div>

<datalist id="languages">
    <option value="PHP">PHP</option>
    <option value="JavaScript">JavaScript</option>
    <option value="Cobol">Cobol</option>
    <option value="C#">C#</option>
    <option value="C++">C++</option>
    <option value="Java">Java</option>
    <option value="Pascal">Pascal</option>
    <option value="FORTRAN">FORTRAN</option>
    <option value="Lisp">Lisp</option>
    <option value="Swift">Swift</option>
</datalist>

$('.flexdatalist:first').clone().appendTo('#wrapper');

It's also not working when I create the HTML code manually by not using clone(). e.g. $('#wrapper').html('<input type="text" class="flexdatalist" name="products[]" ...>')

Do you have any idea how to handle this problem? Many thanks for your help in advance!

Best regards André

[yohannes-taye]

I came across the same problem. Did you find a way?

[pdrlps]

Hi!

This is probably just a regular jQuery issue... you have to re-initialise the binding to dynamically (on the fly) created elements.

In practice, you have to do the binding again after the .clone()...

// clone
$('.flexdatalist:first').clone().appendTo('#wrapper');
// re-initialise
$('.flexdatalist:last').flexdatalist({ options... });