Get the amount of array json type

Question

Get the amount of array json type

Navigation

#1 by (0 votes)

0

I need to traverse N json type arrangements with the jquery library plus these must be filled in an input that is in a table, someone has some idea of how I can my current code works perfectly only if a single fix is returned .

HTML code

                   <div class="contenido">
                        <h3>Detalle</h3>
                        <form id="detalle-form" method="post" class="form-horizontal style-form" >
                            <input id="n-mesa" name="n-mesa"  type="text"></th>
                           <input type="hidden" id="pos"  name="pos">
                          <table class="table table-fixed" id="pedido">
                          <thead>
                             <tr>
                             <th class="col-xs-2">Codigo</th>
                              <th class="col-xs-2">Qty</th>
                              <th class="col-xs-2">Descripción</th>
                              <th class="col-xs-3">Peso</th>
                              <th class="col-xs-3">Precio</th>
                            </tr>
                          </thead>
                            <tr id="fila0">
                                <td class="col-xs-2">
                                         <div class="input-group"><input id="cod0" name="cod0" class="form-control sinborde input-md" placeholder="Ingresar codigo" type="text"></div>
                                 </td>
                                <td class="col-xs-2" ><input id="qty0" name="qty0" class="form-control  sinborde input-sm" type="text"></td>
                                 <td class="col-xs-2" id="producto0"></td>
                                 <td class="col-xs-3">
                                         <div class="input-group"><div class="input-group-addon">Kg</div><input id="peso0" class="form-control input-md " name="peso0"  type="text" value="0"></div>
                                 </td>
                                 <td class="col-xs-3">
                                         <div class="input-group"><div class="input-group-addon">$</div><input id="precio0" name="precio0" class="form-control input-md"  type="text" value="0"></div>
                                 </td>
                            </tr>
                             <tfoot>
                             </table>
                             <table class="table">
                             <tr >
                              <td  class="col-xs-3"></td>
                                  <td class="col-xs-3"></td>
                                  <td class="col-xs-3">Total :</td>
                                  <td class="col-xs-3">
                                     <div class="input-group"><div class="input-group-addon">$</div><input id="total" name="total" class="form-control input-md"  type="text" value="0"></div>
                                 </td>
                            </tr>
                            <tr>
                              <td  class="col-xs-3"><button title="Guardar registro" id="save" name="save" class="btn btn-success"><span class="glyphicon glyphicon-floppy-disk"></span></button>
                                                    <button class="btn btn-success "><span class="glyphicon glyphicon-print"></span></button>
                              </td>
                                  <td class="col-xs-3"></td>
                                  <td class="col-xs-3">Propina Sugerida 10% </td>
                                  <td class="col-xs-3">
                                     <div class="input-group"><div class="input-group-addon">$</div><input id="propina" name="propina" class="form-control input-md"  type="text" value="0"></div>
                                 </td>
                            </tr>

                        </table>

                  </form>

                  <?php if (isset($_POST['save'])){
                            save_pedido();
                        }
                  ?>

                 </div>
                  </div>
                </div>

Javascript code

<script type="text/javascript">
//selecciona mesas
$(document).ready(function(){
    $("#btn-mesas").change(function () {
            $("#btn-mesas option:selected").each(function () {
                id_mesa = $(this).val();
                $.ajax({
                     type:"GET",
                     url:"lib/pedidos/select_mesa.php",
                     data:{id_mesa: id_mesa},
                     dataType:"json",
                     success: function(res){
                          // proble esto pero no se me ocurrio ninguna idea para iterar los td de la tabla 
                         while(res){
                            $('#n-mesa').val(res.idmesa);
                            $('#cod'+cod).val(res.idprod);
                            idcod ++;
                            var $cant = $('#qty'+idqty).val(res.qty);
                            idqty ++;
                            $('#producto'+idprod).text(res.producto);
                            idprod ++;
                            $('#precio'+idpre).val(res.precio);
                            idpre ++;

                            idpes ++;
                         }
                            calcular_valores(res.qty,res.precio);
                     },error:function(res){
                            alert("[AJAX] Error: capturando el arreglo!!");  
                     }
                });
            });
        });

 //Carga los productos al formulario

    //declaracion de variables
    var td = 0;
    var qty = 0;
    var producto = 0;
    var peso = 0;
    var precio = 0;
    var idqty =0
    var idprod=0;
    var idpes=0;
    var idpre=0;
    var pos=0;
    var cod =0;
    var idcod =0;

    //Funcion se activa al ingresar el codigo  <br>
    //Funciona solo con el primer td falta iterar 
    $("#pedido tr").find('td:eq(0) input').each(function() {
        $("#pedido tr").find('td:eq(0) input').change(function(){
          cod = $(this).val();

          if(isNaN(cod)){
              alert("El codigo no puede contener letras");

          }else{
                if(id_mesa == null){
                    alert("Es necesario que seleccione una mesa");
                    $('#btn-mesas').focus();
                 }else{
                         $.ajax({
                         type:"GET",
                         url:"lib/pedidos/select_producto.php",
                         data:{id_prod:cod},
                         dataType:"json",
                         success: function(data){
                                var cant = prompt("Ingresar Cantidad:");
                                if(cant>0){
                                    $('#cod'+cod).val(data.ID);
                                    cod++;
                                    var $cant = $('#qty'+idqty).val(cant);
                                    idqty ++;
                                    $('#producto'+idprod).text(data.DESC);
                                    idprod ++;
                                    $('#precio'+idpre).val(data.PRECIO);
                                    idpre ++;
                                    idpes ++;
                                    agrega_fila();
                                    calcular_valores(cant,data.PRECIO);


                                }else{
                                    alert ("La cantidad debe ser mayor a 0");
                                }
                         },error:function(res){
                                alert("[AJAX] Error: capturando el arreglo!! ");     
                         }
                    });
                 }
          }


 });
    });

    //funcion de actiba al hacer clic en el boton
    $("#selec-prod button").click(function(){
              id_prod = $(this).val();
              id_mesa = $("#btn-mesas option:selected").val();

             if(id_mesa == null){

                alert("Es necesario que seleccione una mesa");
                $('#btn-mesas').focus();
             }else{
                     $.ajax({
                     type:"GET",
                     url:"lib/pedidos/select_producto.php",
                     data:{id_prod:id_prod,id_mesa:id_mesa},
                     dataType:"json",
                     success: function(data){
                            var cant = prompt("Ingresar Cantidad:");

                            if(cant>0){
                                $('#cod'+cod).val(data.ID);
                                idcod ++;
                                var $cant = $('#qty'+idqty).val(cant);
                                idqty ++;
                                $('#producto'+idprod).text(data.DESC);
                                idprod ++;
                                $('#precio'+idpre).val(data.PRECIO);
                                idpre ++;

                                idpes ++;

                                    agrega_fila();
                                    $('#pos').val(pos);
                                    calcular_valores(cant,data.PRECIO);

                            }else{
                                alert ("La cantidad debe ser mayor a 0");
                            }
                     },error:function(res){
                            alert("[AJAX] Error: capturando el arreglo!! ");     
                     }
                });
             }

     });

        function agrega_fila(){

        qty ++;
        td ++;
        producto ++;
        peso ++;
        precio ++;
        cod ++;
        fila = '<tr id="fila'+td+'" ><td class="col-xs-2"><div class="input-group"><input placeholder="Ingresar codigo" name="cod'+cod+'" id="cod'+cod+'" class="sinborde form-control input-md"  type="text"></div></td><td class="col-xs-2" ><input id="qty'+qty+'" name="qty'+qty+'" class="form-control  sinborde input-sm" type="text"></td><td class="col-xs-2" id="producto'+producto+'" name="producto'+producto+'"></td><td class="col-xs-3"><div class="input-group"><div class="input-group-addon">Kg</div><input id="peso'+peso+'" name="peso'+peso+'" class="form-control input-md"  type="text" value="Fila '+td+'"></div></td><td class="col-xs-3"><div class="input-group"><div class="input-group-addon">$</div><input id="precio'+precio+'" name="precio'+precio+'" class="form-control input-md"  type="text" value="0"></div></td></tr>';
        $('#fila'+pos).after(fila);
        pos++;

     return pos;
     }

     var total = 0;
     var sugerida = 0;
     var subTotal =0;
     var porcentaje = 0.10;


     function calcular_valores(cantidad,precio){
        //calcula el total de la boleta
        subTotal = cantidad * precio;
        total = subTotal + total;
        $('#total').val(total);
        //calcula la propina sugeria
        sugerida = total * porcentaje;
        $('#propina').val(sugerida);
     }

});


</script>

This is the result I get for ajax I need to fill out the form

{"idmesa":"2","codventas":"2","codusr":"193178685","estadob":"0","producto":"Leche asada","precio":"1500","idprod":"1","qty":"1"}

{"idmesa":"2","codventas":"2","codusr":"193178685","estadob":"0","producto":"Coca-cola","precio":"1000","idprod":"2","qty":"2"}

javascript jquery html json jsonarray

asked by Johann Sebastian Painevil Len 05.01.2019 в 18:59

source

1 answer

Why is the active class not added? Unable to load SharePoint snap-in in PowerShell

score 0 · Answer 1

What you could do is create as containers of your inputs, concatenate them to a variable (for each type of input) and then make an append where you want those inputs to be displayed. And it would be better to iterate with a forEach .

Something similar to this:

var inputsIdMesas = '';
var inputsX = '';

res.forEach(function (item) {
    inputsIdMesas += '<input id="n-mesa" name="n-mesa"  type="text" value="' + res.idmesa + '"></th>';
    inputsX += '<input id="n-mesa" name="n-mesa"  type="text" value="' + res.idmesa + '"></th>';
});

$('#form').append(inputsIdMesas);
$('#x').append(inputsX);