How to check checkbox of a table already generated dynamically from a JSON, jquery?

Question

How to check checkbox of a table already generated dynamically from a JSON, jquery?

Navigation

#1 by (2 votes)

1

In this way I generate the list dynamically:

var cupones_bienvenida = $('.cupones_bienvenida');
                        var tipoCupon ='';

                        $.each(response.data, function (i) {
                            if (response.data[i].Sub_Tipo == 1){
                                tipoCupon = "Cupón 1";
                            }
                            else if(response.data[i].Sub_Tipo == 2){
                                tipoCupon = "Cupón 2";
                            }
                            else{
                                tipoCupon = "Cupón 3";
                            }


                              $('<tr class="cupones"/>')
                                    .append($('<td/>').addClass('nuevo-td td-cuponera-costarica')
                                        .append($('<label/>').addClass('label-checkbox item-content').text(response.data[i].Nombre)))
                                    .append($('<td/>').addClass('label-cell nuevo-td').append($('<p class="td-parrafor-cupcostarica"/>').text(tipoCupon))
                                        .append($('<p class="td-parrafor-cupcostarica"/>').text("Descuento: "+response.data[i].Descuento)))
                                    .append('<div class="cod_cupon" style="display:none">' + response.data[i].Identificador + '</div>')
                                    .append('<div class="descuento_cupon" style="display:none">' + response.data[i].Descuento + '</div>')
                                    .append('<div class="tipo_cupon" style="display:none">' + response.data[i].Tipo_cupon + '</div>')
                                    .append('<div class="sub_tipo" style="display:none">' + response.data[i].Sub_Tipo + '</div>')
                                    .append('<div class="vencimiento" style="display:none">' + response.data[i].Fecha_vence + '</div>')

                                    .append($('<td/>').addClass('label-cell nuevo-td')
                                                .append($('<label/>').addClass('label-checkbox item-content')
                                                            .append('<input type="checkbox" name="cupon_check" class="cupon_check" value="' + response.data[i].Identificador + '"/>')
                                                            .append($('<span/>').addClass('item-media').append('<i class="icon icon-form-checkbox"></i>'))))
                                    .appendTo(cupones_bienvenida);
                                 if (cantidad_llaves === 0) {
                                    $('.cupon_check').prop('disabled', true)
                                }
                            });
                        llenarValores();

Each record has its checkbox. At the moment of changing my view I keep a JSON with the information of that list, mainly I am interested in the checkboxes. Property chequeado returns me if it was checked or not.

{
  "titulo": "Cupones oricash",
  "cupones": [
    {
      "identificador": "P20170713786C1",
      "descuento": "100",
      "chequeado": true
    },
    {
      "identificador": "P20170713786C2",
      "descuento": "150",
      "chequeado": false
    },
    {
      "identificador": "P20170813943C1",
      "descuento": "100",
      "chequeado": true
    }
  ]
}

At the moment of returning to the view, the list is generated dynamically again, but this time according to the JSON that I had, I must indicate the checkboxes that were marked, I am trying with this function:

function llenarValores(){
        var item_chequeado
        if (json_cupones_chequeados){
            var json_parse = JSON.parse(json_cupones_chequeados);
            $.each(json_parse.cupones, function(i, item) {
               console.log(item);
               item_chequeado = item.chequeado; //Obtengo true o false
            });
        }
        else{
            console.log("Aun no se ha enviado el json");
        }

        $('.cupones_bienvenida > tr').each(function(index, value)
        {
            var cupones = $(this).closest('.cupones');
            //Aca estoy intentando asignar item_chequeado(true o false),para que me indique que checkbox marcados.
            cupones.find('.cupon_check').attr('checked',item_chequeado);

        });
    }

Thank you in advance.

jquery json

asked by JG_GJ 26.09.2018 в 21:30

source

1 answer

MySQL query does not show data [closed] Delete xml elements

score 2 · Accepted Answer

Try it like this:

function llenarValores(){
    var item_chequeado = [];
    if (json_cupones_chequeados){
        var json_parse = JSON.parse(json_cupones_chequeados);
        $.each(json_parse.cupones, function(i, item) {
           console.log(item);
           item_chequeado.push(item.chequeado); //Obtengo true o false
        });
    }
    else{
        console.log("Aun no se ha enviado el json");
    }

    $('.cupones_bienvenida > tr').each(function(index, value)
    {
        var cupones = $(this).closest('.cupones');            
        cupones.find('.cupon_check').attr('checked',item_chequeado[index]);

    });
}