Comment puis-je ajouter de jquery ui autocomplete à un créé dynamiquement élément?

Je vais essayer d'obtenir jQueryUI de saisie semi-automatique pour déclencher de façon dynamique créée formulaire de saisie des éléments, mais cela ne fonctionne pas. J'ai essayé d'utiliser keyup.la saisie semi-automatique et keydown.la saisie semi-automatique comme lier les événements en $.live(), mais il est contraignant pour les nouveaux éléments - seulement ceux qui sont déjà sur la page.

Essayer le code ici (essayez de taper "ava" dans la première entrée, puis cliquez sur "Ajouter une Entrée" et tapez le même dans la nouvelle entrée).

JavaScript:

$(function() {
    $("input#addButton").click(function() {
        $("input.searchInput:last").clone(true).appendTo($(this).closest("form"));
        $("input.searchInput:last").val("");

    })

    $("input.searchInput").live("keydown.autocomplete", function() {
        $(this).autocomplete({
            source: [
                "ActionScript",
                "AppleScript",
                "Asp",
                "BASIC",
                "C",
                "C++",
                "Clojure",
                "COBOL",
                "ColdFusion",
                "Erlang",
                "Fortran",
                "Groovy",
                "Haskell",
                "Java",
                "JavaScript",
                "Lisp",
                "Perl",
                "PHP",
                "Python",
                "Ruby",
                "Scala",
                "Scheme"
                ],

            minLength: 2
        });
    })
});

HTML:

<form name="myForm" method="post">
    <input id="addButton" name="addButton" type="button" value="Add an input" />
    <input name="search" value="" class="searchInput" maxlength="20" />
</form>
  • Juste par curiosité, avez-vous essayé de l'exécution de la liaison à chaque fois qu'un contrôle est créé à l'objet créé? Bon point de départ pour le dépannage...
  • oui, je l'ai fait - jsfiddle.net/6t74T/2 - même résultat.
  • Votre violon jsfiddle.net/6t74T/1) fonctionne pour moi sur Chrome. Je reçois de saisie semi-automatique la boîte ainsi.
  • Vous avez raison... il travaille dans IE8 trop. Hmmm Doit être une IE9 question alors....
  • Cela fonctionne dans IE8 seulement lors de la réinitialisation de la liaison après la nouvelle entrée est créée - jsfiddle.net/6t74T/2. Le jsfiddle fonctionne, mais pas dans mon code...
  • Je pense que cela a quelque chose à voir avec clone() - il ne semble pas être la copie des maîtres - même lors de la spécification de withDataAndEvents ET deepWithDataAndEvents.

InformationsquelleAutor Eric Belair | 2011-07-12