Return element with other added element using after() jquery

Question

I need to add some tr elements using after() function to a tr var in jQuery and then return the whole element. The problem is that if i return the tr var I only get tr var and not the elements added with after(). Here is the function:

    var tr = $('<tr/>');
    $('input[name^="lcs_cognome[' + num_sede +']"]').each(function(index, value){
    var attr = $(this).attr('name').split('[');
    var lcs_num = '';
    for(var i=0; i<attr[2].length-1; i++)
        lcs_num += '' + attr[2][i];

    if(index == 0)
        tr.append($('<td/>').text($('input[name="lcs_nome[' + num_sede +'][' + lcs_num + ']"]').val()))
          .append($('<td/>').text($('input[name="lcs_cognome[' + num_sede +'][' + lcs_num + ']"]').val()))
          .append($('<td/>').text($('input[name="lcs_sede_consegna[' + num_sede +'][' + lcs_num + ']"]').val()))
          .append($('<td/>').text($('input[name="lcs_indirizzo_consegna[' + num_sede +'][' + lcs_num + ']"]').val() + ' ' + $('input[name="lcs_n_civico_consegna[' + num_sede +'][' + lcs_num + ']"]').val()))
          .append($('<td/>').text($('input[name="lcs_telefono_1[' + num_sede +'][' + lcs_num + ']"]').val()));

    else
        tr.after($('<tr/>').append($('<td/>').text($('input[name="lcs_nome[' + num_sede +'][' + lcs_num + ']"]').val()))
          .append($('<td/>').text($('input[name="lcs_cognome[' + num_sede +'][' + lcs_num + ']"]').val()))
          .append($('<td/>').text($('input[name="lcs_sede_consegna[' + num_sede +'][' + lcs_num + ']"]').val()))
          .append($('<td/>').text($('input[name="lcs_indirizzo_consegna[' + num_sede +'][' + lcs_num + ']"]').val() + ' ' +$('input[name="lcs_n_civico_consegna[' + num_sede +'][' + lcs_num + ']"]').val()))
          .append($('<td/>').text($('input[name="lcs_telefono_1[' + num_sede +'][' + lcs_num + ']"]').val())));
  });
  return tr;

I also tried to replace after() with insertAfter() but it didn't work.

Just a side note, I think you should introduce small utility functions and variables in your code to reduce the clutter and make it all more readable e.g. `.getTD()` for `td` element creation, and `getVal(name)` for all those `.val()` related functions. — Tahir Ahmed, Aug 11 '15 at 09:43

score 0 · Answer 1 · edited May 23 '17 at 11:58

0

You must to use insertAfter but you need to return in another way the value:

                return  $('<tr/>')
                        .append(
                            $('<td/>').text($('input[name="lcs_nome[' + num_sede +'][' + lcs_num + ']"]').val())
                        )
                        .append(
                            $('<td/>').text($('input[name="lcs_cognome[' + num_sede +'][' + lcs_num + ']"]').val())
                        )
                        .append(
                            $('<td/>').text($('input[name="lcs_sede_consegna[' + num_sede +'][' + lcs_num + ']"]').val())
                        )
                        .append(
                            $('<td/>').text($('input[name="lcs_indirizzo_consegna[' + num_sede +'][' + lcs_num + ']"]').val() + ' ' + $('input[name="lcs_n_civico_consegna[' + num_sede +'][' + lcs_num + ']"]').val())
                        )
                        .append(
                            $('<td/>').text($('input[name="lcs_telefono_1[' + num_sede +'][' + lcs_num + ']"]').val())
                        )
                    );
            }).insertAfter(tr)

And not return tr in the end because you are returning $('tr') object.

You have more information about it works : https://stackoverflow.com/a/11114453/5035890

edited May 23 '17 at 11:58

Community

1
1

answered Aug 11 '15 at 08:47

Marcos Pérez Gude

21,869
4
38
69

Thanks for the reply. The problem doing like you said is that I can insert only one more tr element to the tr var, isn't it? – pindol Aug 11 '15 at 08:48
No, `tr` var has a jQuery object, for what you need to enlarge this variable with all tr? If you explain what you need, maybe there is another easiest way to make it – Marcos Pérez Gude Aug 11 '15 at 08:50
I need to add some tr element in a table that is added to the dom each time a user click on a button. I need to do it in a function because i need to call it inside the table.append() function – pindol Aug 11 '15 at 08:54
yeah, but why store all `tr` in a variable and return it? – Marcos Pérez Gude Aug 11 '15 at 09:03
because inside append() function called on table element I have to return a tr element – pindol Aug 11 '15 at 09:06

Return element with other added element using after() jquery

1 Answers1