jQuery append string

Question

Hello Stack Overflow i hope you are well today,

I have this code:

  $('.add_child').click(function(){
    var attrName = $(this).attr('name');
    var count = $(this).attr('count');
    $(this).attr('count', (parseInt(count)+1))
    var input = $('<input />');
    input.attr('type','text')
    input.attr('name',attrName+"["+count+"]" ) 
    $('.children_form').append('<li>'+[input]+'</li>');
})

i am trying to get my out to display as:

<li><input /></li>

But it doesn't seem to work properly i am getting this code in my HTML

<li>[object Object]</li>

I believe this line is giving me the issue:

$('.children_form').append('<li>'+[input]+'</li>');

What do you get if you remove the square brackes ([ and ]) from around the input in that final line? — David Thomas
– David Thomas, Commented Mar 16, 2011 at 17:25

Felix Kling · Accepted Answer · 2011-03-16 17:33:21Z

2

With [input] you are creating an array. But '<li>'+input+'</li>' won't work either, because input is an object, not HTML.

You'd have to do like so:

$('.children_form').append($('<li />').append(input));

count is not a valid HTML attribute. You should use .data() instead. You can set the initial value with an attribute in HTML5 data attributes format: data-count="0".

edited Mar 16, 2011 at 17:33

answered Mar 16, 2011 at 17:28

Felix Kling

820k181 gold badges1.1k silver badges1.2k bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Xavier Over a year ago

Winner, Winner, Chicken Dinner !

Felix Kling Over a year ago

@Xavier: I like that movie :)

Xavier Over a year ago

was a great film, well Kevin was awsome in the film :D

Kim Tranjan · Accepted Answer · 2011-03-16 17:33:21Z

0

$('.add_child').click(function(){
    var attrName = $(this).attr('name'),
        count = $(this).attr('count');

    $(this).attr('count', (parseInt(count)+1));

    var input = $('<input />', {
        type: 'text',
        name: attrName + '[' + count + ']',
    });
    $('.children_form').append($('<li>').html(input));
});

answered Mar 16, 2011 at 17:33

Kim Tranjan

4,5613 gold badges42 silver badges39 bronze badges

1 Comment

Kim Tranjan Over a year ago

@Felix, no sir. It accepts jQuery Objects too. You can try it by yourself.

Collectives™ on Stack Overflow

jQuery append string

2 Answers 2

3 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related