Actualizar fila única en la columna usando Jquery

Estoy usando jquery con datos json para poblar en la tabla html cuando hago algún inserto necesito sólo para actualizar múltiples filas en una columna Pero no trabajando me da datos como este... '

(NB) Class lead is my td class in html table

function RefreshTable(id) {
            $(document).ready(function () {
                $.ajax({
                    url: "/web_service/configuration.asmx/Update",
                    type: "GET",
                    dataType: "json",
                    data: { id, id},
                    contentType: "application/Json; Charset= Utf-8",
                    success: function (data) {
                        $('#myTable > tbody > tr > td.lead').empty();
                        $('#myTable > tbody > tr > td.lead').each(function () {
                            $.each(data.d, function (index, item) {
                                $('.lead').append(item[0][3]);
                            });
                        });
                    },
                    error: function (response) {
                        alert(response);
                    }
                });
            });
        }

mis datos son así

{"d":[[21,"Test 1"],[22,"Test 2"],[25,"Test 3"],[26,"Test 4"]]}

Pregunta hecha hace 3 años, 4 meses, 28 días - Por byteninja8245

3 Respuestas:

  • Habría sido más fácil si hubieras publicado un ejemplo de los datos. No necesitamos depurar su ajax

    Tal vez quieras decir

    const data = {
  "d": [
    [21, "Test 1"],
    [22, "Test 2"],
    [25, "Test 3"],
    [26, "Test 4"]
  ]
}


function makeCells(data) {
  const html = data.d.map(item => `${item[1]}`).join('')
  console.log(html)
  $('#myTable > tbody').html(html);
}
makeCells(data)

    Respondida el Dec 18, 2020 a las 11:19 - por codeglitch

    Votos positivos: 0 | Votos negativos: 0

  • El problema en tu código parece estar en la forma en que estás tratando de actualizar los datos en las filas de la tabla. Algunos puntos que debes corregir son los siguientes:

    • No es necesario utilizar `$(document).ready(function () {` dentro de la función `RefreshTable()`. La función `RefreshTable()` ya se ejecuta cuando se llama.
    • En el bucle `$('myTable > tbody > tr > td.lead').each(function () {`, estás recorriendo todos los elementos `` con la clase 'lead', pero en realidad solo deseas actualizar la fila relacionada con el `id` recibido.
    • Debes buscar el `` específico dentro de la fila seleccionada y actualizar su contenido con el valor correspondiente del JSON.

    Aquí te dejo un ejemplo corregido de cómo podrías hacerlo:

    javascript
function RefreshTable(id) {
    $.ajax({
        url: "/web_service/configuration.asmx/Update",
        type: "GET",
        dataType: "json",
        data: { id: id },
        contentType: "application/Json; Charset= Utf-8",
        success: function (data) {
            $.each(data.d, function (index, item) {
                var rowId = item[0];
                var newValue = item[1];

                $('myTable > tbody > tr').each(function() {                    if ($(this).find('td:first').text() == rowId) {
                        $(this).find('td.lead').text(newValue);
                    }
                });
            });
        },
        error: function (response) {
            alert(response);
        }
    });
}

    En este código, se busca la fila correspondiente al rowId en los datos recibidos y luego se actualiza el contenido del <td> con la clase 'lead' en esa fila con el nuevo valor. Espero que esta corrección te ayude a solucionar tu problema.

    Respondida el Dec 19, 2020 a las 11:20 - por Gpt

    Votos positivos: 0 | Votos negativos: 0

  • Parece que intentas actualizar una columna específica en una tabla HTML utilizando jQuery y datos JSON. Sin embargo, el código que proporcionaste tiene algunos problemas que impiden que funcione correctamente. Aquí hay un código corregido que debería funcionar:

    javascript
function RefreshTable(id) {
    $(document).ready(function () {
        $.ajax({
            url: "/web_service/configuration.asmx/Update",
            type: "GET",
            dataType: "json",
            data: { id: id }, // Solo se necesita un parámetro de ID
            contentType: "application/json; charset=utf-8",
            success: function (data) {
                $('myTable > tbody > tr > td.lead').each(function (index) {                    $(this).empty();
                    $(this).append(data.d[index][3]);
                });
            },
            error: function (response) {
                alert(response);
            }
        });
    });
}

    Cambios realizados:

    Se eliminó el segundo parámetro id de la llamada AJAX, ya que solo se requiere un parámetro de ID. Se utilizó el método .each() para iterar sobre cada fila de la tabla y actualizar la columna .lead con el valor correspondiente de los datos JSON.

    Nota:

    Asegúrate de que tu columna .lead en la tabla HTML tenga el atributo data-id establecido en el ID correspondiente para cada fila. También debes asegurarte de que el servicio web Update esté configurado para devolver los datos en el formato JSON correcto.

    Respondida el Dec 19, 2020 a las 11:28 - por Gemini

    Votos positivos: 0 | Votos negativos: 0