jquery load in multiple rows

Question

I need that $("#pedido_x").change(function(event) works on each dynamic row is created. Any idea?

I tried a few things but nothing works.

window.precio;
window.precio_final;
window.cantidad;
var i = 1;

$(".mas").click(function(){
    i = ++i;
    var select_marca = '<OPTION value="">- SELECCIONAR -</OPTION><?php $queryma = mysqli_query($conex, "SELECT * FROM marcas ORDER BY nombre ASC"); while ($ma = mysqli_fetch_assoc($queryma)) { echo '<option value='.$ma["id"].'>'; echo $ma["nombre"]; } ?></SELECT>';

    var row = "<tr pedido_="+ i +"><td><SELECT id='marca_"+ i +"' name='marca["+ i +"]'> "+ select_marca + "</td><td><input type='text' id='producto_"+ i +"' name='producto["+ i +"]'></td><td><input type='number' id='cantidad_"+ i +"' name='cantidad["+ i +"]'></td><td><input type='number' id='precio_"+ i +"' name='precio["+ i +"]' value='0'></td></tr>";
    $("table tbody").append(row);
}); 

$("#pedido_1").change(function(event){
    window.f = 1
    while (f <= i)
    {   
        var marca = $("#marca_"+ f).find(':selected').val();
        var producto = $("#producto_"+ f).find(':selected').val();
        window.cantidad = $("#cantidad_"+ f).val();

        if(producto == null)
        {
            producto = 'Ninguno';
        }
        $("#producto_"+f).load('sel_marca.php?marca='+ marca +'&producto='+ producto +'&fila=' + window.f);
        if(producto != 'Ninguno')
        {
            $.get('sel_precio.php?f='+ f +'&producto='+ producto, function(data) {
                window.precio = data;
            });  
        }
        window.precio_final = window.cantidad * window.precio;
        $("#precio_"+f).val(window.precio_final);
        producto = $('#producto_'+ f).find(':selected').val();
        f++
    } 
}); 
});

For dynamically loaded things you need to use .on() http://api.jquery.com/on/ — Funk Doc, Dec 07 '18 at 20:14
Tried $("[id^=pedido_]").on('change', function(event) with same results. Only works on the static row. — Alan Cluet Saball, Dec 07 '18 at 20:44
`#pedido_` implies it'll only hit the element with ID `pedido_`. Do you mean to use classes instead? — Hodrobond, Dec 07 '18 at 20:52
It's an issue with it being dynamic content, not that the selector is not valid. This is all covered in the duplicate. — Taplar, Dec 07 '18 at 20:54
on the duplicate all i saw is target the parent that exist on static content, but i need to work on each row, statics and dinamycs, separately Maybe a way to get the id of the dinamycs ones to work with? — Alan Cluet Saball, Dec 07 '18 at 21:01
You bind a delegate on a static parent of the elements that are dynamically created, and you use the child filter of `[id^="pedido_"]` that you tried before (or use a common class instead), and then the events from the dynamic elements will bubble up from them and be handled by the delegate event listener. — Taplar, Dec 07 '18 at 21:44
That helped, now i can identify each row separtely, but still cant put the results in there, only in the first one. — Alan Cluet Saball, Dec 07 '18 at 23:23

jquery load in multiple rows

0 Answers0