Javascript append input with "multiple" attribute

Question

How do I use javascript to append the value of an input when it has the attribute "multiple"?

i.e. <input type='hidden' name='test[]' multiple>

So like how you would set the value of a normal input document.getElementById("myId").value = "whatever"; but to work with an input that has the attribute 'multiple'

I have no clue what you are asking. Your question needs more details. I assume it should be type="file" — epascarello
– epascarello, Commented Mar 31, 2020 at 20:22
Sorry, what? multiple is only valid for <select> or <input type="file">. And using Vanilla JS you can set/unset attributes assigning the value of the property directly element.multiple=true|false. — Gabriel
– Gabriel, Commented Mar 31, 2020 at 20:25
Multiple on an input only applies to file or email fields MSDN. But like @Gabriel said you probably need <select> — Jeroen Bourgois
– Jeroen Bourgois, Commented Mar 31, 2020 at 20:27

Quentin · Accepted Answer · 2020-03-31 20:32:50Z

0

I am trying to set the value of the input, not the attribute. By set, I mean append because it is a 'multiple' input

The multiple attribute does not apply to hidden inputs.

If you want to append to the value, then read the current value, and include it in the new value.

input.value = input.value + "some other string";

Since you've used PHP-style naming conventions, possibly you want to create an additional input:

const newInput = document.createElement("input");
newInput.name = "test[]";
newInput.type = "hidden";
newInput.value = "some other string";
input.insertAdjacentElement("afterend", newInput);

So the submitted data will be treated as an array of values in whatever is processing it once submitted.

edited Mar 31, 2020 at 20:32

answered Mar 31, 2020 at 20:31

Quentin

949k136 gold badges1.3k silver badges1.4k bronze badges

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

1 Comment

James Driver Over a year ago

This was super helpful. Thanks :)

Mark Minerov · Accepted Answer · 2020-03-31 20:26:33Z

-1

Try this:


<select id="select">
    <option>...</option>
</select>

<script defer>
    document.querySelector("#select").setAttribute("multiple", "multiple")
</script>

answered Mar 31, 2020 at 20:26

Mark Minerov

3061 silver badge11 bronze badges

1 Comment

James Driver Over a year ago

I am trying to set the value of the input, and by set I mean append because it has the attribute 'multiple'. Sorry if the question was vague. I edited it to hopefully reflect this better

Collectives™ on Stack Overflow

Javascript append input with "multiple" attribute

2 Answers 2

1 Comment

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related