Reemplazar un botón por medio de jQuery

Reemplazar un botón por medio de jQuery

Me encontré en la siguiente situación, tenia un web control que se utiliza en algunos formularios haciendo postback y funciona sin problemas, hasta ahí todo bien, pero se presentó la situación de evitar que el botón haga directamente postback para poder incluir unas llamadas con ajax jQuery y en ese momento empezó el problema.

La solución que se me ocurrio fue incluir un nuevo botón, uno que funcione con el postback (para efectos de no alterar lo que ya está funcionando) y el otro que se pueda manipular por medio de jQuery par hacer las llamadas Ajax, como no quería cambiar el control la alternativa fue agregar el botón en el cliente.

Los pasos que seguí para incluir un botón en el cliente fueron los siguientes

1. Clonar un botón html de referencia que ya esté en el formulario

2. Cambiar el ID de nuevo botón

3. Poner el nuevo nombre del botón

5. Programar el evento click del nuevo botón

4. Como la idea es reemplazar el botón que ya existe, se toma la ubicación de referencia del botónn actual (.parent()) y se agrega el nuevo botón (.append())

5. Ocultamos el botón anterior (el que hace postback)

La programación jQuery es la siguiente

var btnNew = $("#cmdReferencia").clone();

btnNew.addClass('Boton');

btnNew.attr('id','cmdNuevoBoton');

btnNew.attr('value','Buscar Paciente');

btnNew.click(function(){alert('hola')});

$('#btnAnterior').parent().append(btnNew);

$('#btnAnterior').hide();

No hay comentarios: