Add multiple values in input field with jQuery

Question

I want to add multiple input values in an input field with jQuery. So that everytime I hit the button, a new value is added in the same field along with the old value.

I am trying following code, but it does not add the value, it simply overwrites the previous value.

HTML:

<div class="wrap">
    <button>Add value</button>
    <input name="myinput[]" value="" />
</div>

jQuery:

$("button").click(function(e) {
    e.preventDefault();
    $(this).parent().find('input[name=myinput\\[\\]]').val("value+");   
});

Demo: http://jsfiddle.net/D97bV/

Please care to explain what do you really want to "add" into "what value"? It's not working because you are setting a static value "value+" — Rey Libutan
– Rey Libutan, Commented Sep 2, 2013 at 17:33
@Kampai i just used a static value in above example. Idea is to pass multiple strings in a hidden input field to store in db. I got the answers below but thanks. — user1355300
– user1355300, Commented Sep 2, 2013 at 17:43

adeneo · Accepted Answer · 2013-09-02 17:33:48Z

4

You add strings together with +

$("button").on('click', function(e) {
    e.preventDefault();
    var elem = $(this).parent().find('input[name=myinput\\[\\]]');

    elem.val( elem.val() + 'add this' );
});

FIDDLE

Now you only need something useful to add ?

answered Sep 2, 2013 at 17:33

adeneo

319k29 gold badges410 silver badges392 bronze badges

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

Comments

Kiran · Accepted Answer · 2013-09-02 17:34:08Z

2

Try:

$("button").click(function(e) {
    e.preventDefault();
    var val = $(this).parent().find('input[name=myinput\\[\\]]').val();
    $(this).parent().find('input[name=myinput\\[\\]]').val(val+"value+");

});

DEMO FIDDLE

answered Sep 2, 2013 at 17:34

Kiran

20.3k11 gold badges72 silver badges101 bronze badges

Comments

fujy · Accepted Answer · 2013-09-02 17:34:19Z

1

try this:

$("button").click(function(e) {
    e.preventDefault();
    var myInput = $(this).parent().find('input[name=myinput\\[\\]]');
    myInput.val(myInput.val() + "value+");   
});

answered Sep 2, 2013 at 17:34

fujy

5,3015 gold badges33 silver badges51 bronze badges

Collectives™ on Stack Overflow

Add multiple values in input field with jQuery

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related