how can I capture the value of an input that is duplicated with its same id from javascript

-2

I have this problem and I have already managed to capture two texts that come from php, but I have not been able to capture the value of the input which I must fill with numeric characters and show them in an emerging modal that allows verifying the information entered in the input

                if (text == ref_medicamento)
                {
                    var id = <?php echo json_encode($producto->id); ?>;
                    var sptext = text.split();
                    var newtr = '<tr class="item" data-id="' + id + '">';
                    newtr = newtr + '<td class="iProduct" >' + ref_medicamento + '</td>';
                    newtr = newtr + '<td class="iProduct" >' + nombre_medicamento + '</td>';
                    newtr = newtr + '<td class="iProduct"><input type="number" class="form-control" id="cant" name="ListaPro" /></td>';
                    newtr = newtr + '<td><button type="button" class="btn btn-danger btn-xs remove-item"><i class="fa fa-times"></i></button></td></tr>';
                    $("#validar").append(ref_medicamento," ",nombre_medicamento,  '<br/>' );
                    $("#generar").click(function () {
                        var cant = $("input[name='ListaPro'] ").val();
                    })  
                }

Here is where I show the values of javascript, minus the value of the input that I enter in the interface

        <div class="modal fade" id="myModalDialog" tabindex="-1" role="dialog" aria-labelledby="basicModal" aria-hidden="true">
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header" style="background: #df0101; color: #ffffff">
                        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                        <h3 class="model-title"><strong>Estas Seguro?</strong></h3>
                    </div>

                    <div class="modal-body">
                        <h4><strong>Verifica toda la información del pedido</strong>...<strong style="color: #df0101">RECUERDA</strong> que despues de enviado, <strong>NO</strong> hay posibilidad de cambiar informacion.</h4>
                    </div>

                    <div class="modal-footer">
                        <a href="#" data-dismiss="modal" class="btn btn-danger">Solicitar Pedido</a>
                        <a href="#" class="btn btn-default" data-dismiss="modal">Hacer Cambios</a>
                    </div>
                </div>
            </div>
        </div>  
    
asked by Juan Esteban Yarce 18.01.2018 в 17:14
source

1 answer

1

Instead of putting the input of id " cant " to dry, better add a class cant to it and put the id for example like this:

"#cant" . $id // En PHP
"#cant" + id // En javascript

In this way you get the id to be unique. Then you just have to find the input value like this:

var v = $(".cant > #cant" + id).val(); // Siendo id el elemento a capturar

In your same code it would be:

if (text == ref_medicamento) {
    var id = <?php echo json_encode($producto->id); ?>;
    var sptext = text.split();
    var newtr = '<tr class="item" data-id="' + id + '">';
    newtr = newtr + '<td class="iProduct" >' + ref_medicamento + '</td>';
    newtr = newtr + '<td class="iProduct" >' + nombre_medicamento + '</td>';
    newtr = newtr + '<td class="iProduct"><input type="number" class="form-control cant" id="cant' + id + '" name="ListaPro" /></td>';
    newtr = newtr + '<td><button type="button" class="btn btn-danger btn-xs remove-item"><i class="fa fa-times"></i></button></td></tr>';
    $("#validar").append(ref_medicamento," ",nombre_medicamento,  '<br/>' );
    $("#generar").click(function () {
        var cant = $("#cant" + id).val();
        console.log(cant); // o alert(cant);
    })
}
    
answered by 01.02.2018 в 18:12