[SOLUCIONADO] Div recargado dinamicamente no funciona

[lvinuezav]

Estimados buenos días, si no es molestia me gustaría consultarles y de lo posible me ayuden con lo siguiente,

tengo una pagina la cual al dar click sobre un botón recarga en un div llamado "grid" la información desde otra pagina pero al dar click sobre la imagen de eliminar no funciona el contenido recargado dinamicamente, detallo contenido de paginas

index.php
//SCRIPT DEL BOTON AGREGAD ITEM FUNCIONA OK
$('#agreitem').click(function()
{
var bienserv=$("#bienserv").val();
var dataString = 'bienserv='+bienserv+'&a=acc';
if($.trim(bienserv).length>3)
{
$.ajax({
type: "POST",
url: "retorna.php",
data: dataString,
cache: false,
beforeSend: function(){ $("#agreitem").val('Procesando...');},
success: function(html)
{
if(html)
{
$("#agreitem").val('Agregar Item');
$("#bienserv").val('');
//LLENO DINAMICAMENTE EL DIV LLAMADO GRID CON LOS DATOS DE RETORNA.PHP
$("#grid").html(html);
}else
{
alert("Error");
$("#agreitem").val('Agregar Item');
}
}
});
}else{
alert("El Bien o Servicio no debe ser vacío, Cantidad y Precio debe ser mayor a 0");
return false;
}
});
//VERIFICO SI HICE CLICK SOBRE LA IMAGEN ELIMINAR, ESTO NO ME FUNCIONA YA QUE DESPUES DE LLENAR DINAMICAMENTE EL GRID NO HACE NADA.

$('img[id=elimina]').click(function()
{
var id=$(this).attr("name");
var dataString = 'id='+id+'&a=ucc';
if(id.val()>0)
{
$.ajax({
type: "POST",
url: "retorna.php",
data: dataString,
cache: false,
success: function(html)
{
if(html)
{
$("#grid").html(html);
}else
{
alert("VV");
}
}
});
}else{
return false;
}
});

});

<legend>DATOS DEL BIEN O SERVICIO</legend>
<div style="padding:5px;">
<label>Bien/Servicio: </label>&nbsp;&nbsp;
<input name="bienserv" id="bienserv" size="67" type="text" placeholder="Ingrese el Producto" required="required" autofocus="autofocus" minlength="3"> &nbsp;&nbsp;<input type="button" value="Agregra Item" class="btn btn-primary ewButton" id="agreitem" name="agreitem"></input>
</div>


retorna.php
switch($_POST['a'])
{
//Agrega bienes
case 'acc': extract($_REQUEST);
//DATOS DINAMICOS QUE LLENA EL DIV GRID DE INDEX.PHP Y NO FUNCIONA AL DAR CLICK EN ELIMINAR
$html='<img src="phpimages/eliminar.png" width="12" height="14" border="0" id="elimina" name="'.$v["id"].'">';
echo $html;
break;
//Elimina bienes
case 'ecc': extract($_REQUEST);
$html='<img src="phpimages/actualizar.gif" width="20" height="20" border="0" id="actualiza" name="'.$v["id"].'">';
echo $html;
break;
}

[diurno10]

Código Javascript:

$('img[id=elimina]').on("click",function(){
    var id=$(this).attr("name");
    var dataString = 'id='+id+'&a=ucc';
    if(id.val()>0){ 
        $.ajax({
        type: "POST",
        url: "retorna.php",
        data: dataString,
        cache: false,
        success: function(html){
            if(html){
                $("#grid").html(html);
            }else{
                alert("VV");
            }
        }
        });
    }else{
        return false;
    }
});
 

[diurno10]

Al cargar contenido por ajax, el navegador no sabe que eso existe por lo tanto debes de utilizar

.on si la version de jQuery es mayor a 1.7 sino .live

[lvinuezav]

Estimado Diurno10,

Cambie a .on ya que utilizo la version 1.11 pero me lo hace bien la primera vez, pero cuando viene desde responder.php no hace nada.

[lvinuezav]

Estimados diurno10,

Gracias por tu ayuda, investigando en base a lo que me sugeriste encontré la solución y efectivamente es con la opcion .on pero cambiando con lo siguiente:

$(document).on('click', 'img[id=elimina]', (function(e) {
//AQUI CODIGO

}));

Funciona ok y sin problemas ya que estoy generando datos dinámicos y tengo que delegar el objeto.

Muchas gracias.