Agregar botones jQueryui a contenido agregado dinámicamente

Question

Tengo una lista de elementos que tienen asociados algunos botones jQueryUI. Después de una acción (borrar un elemento), quiero volver a cargar la lista a través de ajax.

El único problema es cuando lo hago, los botones JQueryUI ya no se muestran, solo el marcado estándar.

Sé que puedo usar jQuery.live() para agregar dinámicamente manejadores de clics, etc., pero ¿cómo puedo aplicar un jQueryUI button() a ellos?

Answer 1

Al volver a cargar a través de AJAX, llame .button() (o cualquier variante que está utilizando) en la que context, así:

$.ajax({ 
    //other options.. 
    success: function(data) { 
    //insert elements 
    $(".button", data).button(); 
    } 
}); 

Esto ejecutará .button() en los elementos solo en la respuesta (no los otros ya están en la página/DOM en otro lugar) con class="button".

realmente no se puede utilizar .live() ni nada de eso aquí, que se basa en que burbujea caso, no es realmente nada que ver con la adición/eliminación de elementos ... cuando se trata de los plugins que necesita que ejecutar de nuevo en contra de la nuevos elementos que agregas O bien, el método menos eficiente pero más genérico sería el .livequery() plugin, que se utiliza como esto:

$(".button").livequery(function() { 
    $(this).button(); 
}); 

Como ya he dicho, sin embargo, no es lo más eficiente del mundo, ya que en realidad controla el DOM para los cambios en diversos formas.

Answer 2

Se puede volver a unirse con el controlador de eventos:

$("#mybutton").unbind().click(function(){ ..do..something... });