Agregar botón de Jquery ui dinámicamente

Question

Tengo una función de javascript que elimina los botones existentes y agrega otros nuevos.

Aquí está el código:

function FunctionName(){ 
    ("button").remove(); 
    // This works fine. 
    //but however, with the following add code, I don;t get a jquery ui button. 
    var element = document.createElement("input"); 
    element.setAttribute("type","button"); 
    // other code 
    divName = get <div> by ID; 
    divName.appendChiled(element); 
} 

¿Hay alguna forma de añadir un botón de jQuery UI de forma dinámica:

como:

divName.add("button");

No funcionó ...

Answer 1

Bastante seguro que puede abotonar cualquier entrada con jQu Ery-UI llamando button()

var element = document.createElement("input").button(); 

Answer 2

Para añadir un botón de jQuery UI utilizando jQuery:

$('#selector') // Replace this selector with one suitable for you 
    .append('<input type="button" value="My button">') // Create the element 
    .button() // Ask jQuery UI to buttonize it 
    .click(function(){ alert('I was clicked!');}); // Add a click handler 

Answer 3

Ninja UI funciona de esta manera de forma predeterminada, sin la piratería en HTML que consigue anular.

Puede crear el botón como una variable antes de que DOM esté listo.

var $button = $.ninja.button({ 
    html: 'Post Your Answer' 
}).select(function() { 
    // Your action here. 
}); 

Cuando el DOM esté listo, añádalo donde desee que vaya el botón.

$('body').append($button); 

Answer 4

Acabo de crear un botón dinámicamente con el siguiente código. La parte clave es la parte .button(), y parece funcionar bien para mí.

var self = this; 
var exitButton = $(document.createElement("a")); 
exitButton.attr({ 
    'href': '#', 
    'id': 'exitSlideshowButton', 
}); 
exitButton.click(function(event){ 
    event.preventDefault(); 
    self.exitSlideshow(); 
}); 
exitButton.text("Exit Slideshow Mode") 
exitButton.button(); 
exitButton.appendTo("body"); 

Answer 5

Este código funcionó para mí

$('#selector').append('<input type="button" value="My button">');

$('#selector').click(function(){ alert('I was clicked!');});

Answer 6

creo @Stony estaba cerca, a excepción de los métodos .button() y .click() estaban siendo añadidos al elemento selector original, no la botón real Debería crear una identificación para el botón, luego seleccionar ese botón y llamar al button().click() en eso.

Esto probablemente está causando algún tipo de excepción con la llamada a button() como se comentó en esa publicación.

Answer 7

Solicité de @Stony y funcionó para mí.

function addMyButton(btID){ 
    var temp = "<button id='" + btID + "'>My Button</button>"; 
    $("#selector").html(temp); 
    $("#" + btID) 
     .button() 
     .click(function(){ 
      alert("I was clicked!"); 
     }); 
}