No se pudo enlazar el typeahead de bootstrap de twitter para las filas generadas con JQuery con campos de texto - jquery, twitter-bootstrap, bootstrap-typeahead

Tengo una tabla con una sola fila, las filas tienen uncampo de texto en su primera celda y el campo de texto en bind to twitter bootstrap typeahead en un archivo js separado. Pero los usuarios pueden crear filas con el botón Agregar y la primera fila se clona para crear filas adicionales. Ahora esperaba que el typeahead funcionara bien en estos campos de texto clonado, pero no funciona y no se muestra ningún error en la consola. Los campos de texto clonado tienen la misma identificación y nombre que el campo de texto original. Alguna idea de por qué esto podría ser ? y alguna sugerencia sobre cómo manejarlo?

Respuestas

Supongo que .typeahead () no se inicia en las filas creadas / clonadas dinámicamente. Puede desencadenar un evento cuando se agrega la fila y adjuntar el typeahead usando jquery .on () ...

$("#btnAddRow").click(function(){
var newRow = $("<div class="row"><input type="text" placeholder="Start typing.." class="typeahead" data-items="3"></div>");
newRow.insertBefore("#addRow");
$(".typeahead").trigger("added");

});

$(".typeahead").on("added",function(){
$(".typeahead").typeahead(typeaheadSettings);
});

Aquí hay un ejemplo de trabajo.