Estoy desarrollando un sitio web simple en HTML y tratando de implementar una función de eliminación en JavaScript que toma un valor de identificación pasado dentro de los parámetros onClick. Luego se concatena con URI de API para eliminar de una base de datos. Cuando se ejecuta el evento onClick, el valor de identificación cambia y no puedo entender por qué.
La función getImages() recupera datos de la API y los agrega a una lista, agregando el botón de eliminar para cada imagen.
Una identificación de ejemplo cuando se obtiene para la función getImages() se muestra en el registro de la consola: 637767724469985182
function getImages(){ $('#ImageList').html('<div class="spinner-border" role="status"><span class="sr-only"> </span>'); $.getJSON(IMAGERAA, function( data ) { var items = []; $.each( data, function( key, val ) { console.log(val["id"]); items.push('<button type="button" id="deleteAsset" class="btn btndanger" onclick="deleteAsset('+val["id"] +')">Delete</button> <br/><br/>'); items.push( "<hr />"); }); $('#ImageList').empty(); $( "<ul/>", { "class": "my-new-list", html: items.join( "" ) }).appendTo( "#ImageList" ); }); }El registro de la consola muestra que la identificación cuando se pasó a la función de eliminación cambió a 637767724469985200.
function deleteAsset(id){ console.log(id); $.ajax({ type: "DELETE", url: IMAGEDIA1 + id + IMAGEDIA2, }).done(function( msg ) { getImages(); }); }Le falta un conjunto de comillas alrededor de la cadena pasada a deleteAsset() en el html
Intenta cambiar:
onclick="deleteAsset('+val["id"] +')"a
onclick="deleteAsset(\"'+val["id"] +'\")"