Question

I have a select list with products on clicking an add button you it will generate the info and display it inside input boxes that are inside a div that has an id, each time you add a product a new div is added, on registering all products I want to get the info of the input boxes for each div that is created here’s the code:
This is the one that makes the div’s and inputs

$(document).on('click', '#ap', function() {
    var desctext =  $('#descripcion option:selected').text();
    var descval = $('#descripcion option:selected').val();
    var html = 
        '<div class="productoaline">' +
        '<input type="text" class="id" name="descval" readonly="readonly" value="' + descval + '"/>' +
        '<input type="text" class="text" readonly="readonly" value="' + desctext + '"/>' +
        '<input type="text" class="text" name="cantidad" placeholder="CANTIDAD DESEADA" value=""/>' +
        '<input type="button" class="button remove" value="Quitar" />' +
        '<div>';
    $('#productosa').append(html);
});

This is the one to get values that I have so far

$(document).on('click', '#registrar', function(){
//var idp;
var cant;

// $('.productoaline').each(function(index){

$('.productoaline').each(function(index){
    //idp = $('name=["descval"]').val();
    cant = $('name=["cantidad"]').val();
    alert(index + ':' + cant);
 });

 // });

});

I only need the ones that have names how can I get only those inputs from each div. how about selecting the even index it appears that the even index are the one that I need.
Thank’s for the help! I’ve thought of using map but I have never used it any insight would be greatly appreciated

Answer 1

A few things to note here…

• You’re only supposed to use a certain id once in a document, if you’re using it more than once, you might want to consider using a class, or try iterating the id: “productoaline1”, “productoaline2”, etc…
• Inside of your each loop you’re selecting #cantidad, which will naturally only give you a result the third time.
• You should be using console.log() instead of alert() to display debug information. This will output information to your browser’s console. You access the console via something like Firefox’s Firebug, or Google Chrome’s Inspector.

I’m not sure exactly what you’re asking, but I think you might be looking for something like this:

$('#productoaline > input').each( function( index ){
    console.log( index, $(this).val() );
});