Tomar valor con Javascript

Buenas, soy nuevo en el foro espero me puedan ayudar. Estoy desarrollando una aplicación donde se puedan mostrar todos los productos que se comercializan, para mostralos no tengo ningún problema lo hago con json así.

<script>
    function broches() {
        $.getJSON('http://miserver/archivo.php', function(data) {
            console.log(JSON.stringify(data));
 
          var datos;
            for (var i = 0; i < data.length; i++) {
                //document.getElementById('tile-collapse-8').innerHTML += '<p>' + data[i].descripcion + '</p>';
                document.getElementById('broches').innerHTML +=
                  '<div class="tile-wrap" id="tile-parent-1">' +
                    '<div class="tile tile-collapse">' +
                      '<div class="tile-toggle" data-parent="#tile-parent-1" data-target="#' + data[i].codigo_anterior + '" data-toggle="tile">' +
                        '<div class="pull-left tile-side">' +
                          '<div class="avatar avatar-blue avatar-sm">' +
                            '<span class="icon icon-alarm"></span>' +
                          '</div>' +
                        '</div>' +
                        '<div class="tile-inner">' +
                          '<div class="text-overflow">' + data[i].descripcion + '</div>' +
                        '</div>' +
                    '</div>';
 
                document.getElementById('broches').innerHTML +=
                  '<div style="" aria-expanded="false" class="tile-active-show collapse" id="' + data[i].codigo_anterior + '">' +
                    '<form id="formulario" action="JavaScript:enviarform();">' +
                      '<input type="text" name="codimgesa" id="codimgesa" value="' + data[i].codigo_anterior + '">' +
                      '<input type="submit" value="enviar" id="enviar" name="enviar">' +
                    '</form>' +
                  '</div>' +
                  '</div>' +
                  '</div>';
            }
 
        });
 
    }
</script>

Mi problema está al tomar los datos de los formularios. Al enviar cualquier formulario que se creó con el for en mi primer código, toma sólo los datos del primer formulario.

<script>
    function enviarform() {
        document.getElementById('mnsj').innerHTML = "";
        var codi = $('#codimgesa').val();
        var cantidad = $('#cantidad').val();
        var codbarra = $('#codbarra').val();
 
        $.ajax({
            type: 'GET', //tipo de petición
            data: "codig=" + codi + "&cantidad=" + cantidad + "&codbarra=" + codbarra,
            dataType: 'jsonp', //tipo de datos
            jsonp: 'callback', //nombre de la variable get para reconocer la petición
            url: 'http://miserver/archivo.php',
            error: function(xhr, status, error) {
                alert("error");
            },
            success: function(jsonp) {
                $(".data").html(jsonp.codig);
            }
        });
 
        document.getElementById('mnsj').innerHTML +=
          '<div class="toast toast-show">' +
            '<div style="top: -218px; left: 248px; display: block; position: relative;" id="tooltip970957" class="tooltip bottom in">' +
              '<div class="toast-inner tooltip-inner">' +
                '<div class="data">' +
                '</div>' +
              '</div>' +
            '</div>' +
          '</div>';
 
    }
</script>

Muchas Gracias, ojalá me puedan ayudar.

Respuestas

#1

El problema que veo en el primer código es que dentro del for generas un montón de formularios, pero todos tienen el mismo id. Además, todos los campos de formulario también tienen el mismo name e id. No se si los name repetidos influirán en tu caso, pero los id repetidos sí que van a causarte problemas. Ten en cuenta que dos elementos diferentes no pueden compartir el mismo id en una página.

@javiereguiluz

13 octubre 2015, 17:15