I want to add multiple selection in Javascript

Question

When I try to select two options it gives me the first option two times.

Here is the code :

<head>
  <script type="text/javascript">
    function choices() {
      var y = document.getElementById("s");
      var x = document.getElementById("output");
      var choice = y.value;
      for (i = 1; i <= 3; i++) {
        var current = y[i];
        if (current.selected == true) {
          x.innerHTML += "the language is, " + choice + "<br>";
        }
      }
    }

  </script>
</head>

<body>
  <form action="">
    <fieldset>
      <select id="s" multiple="multiple" size="4">
        <option>--Choose language--</option>
        <option value="HTML">HTML</option>
        <option value="JAVA">JAVA</option>
        <option value="PHP">PHP</option>
      </select>
      <input type="button" value="show" onclick="choices()">
    </fieldset>
  </form>
  <div id="output"></div>

</body>

refere stackoverflow.com/questions/2049710/…

Devsi Odedra
– Devsi Odedra

2017-11-10 12:35:20 +00:00
Commented Nov 10, 2017 at 12:35 — Devsi Odedra
– Devsi Odedra, Commented Nov 10, 2017 at 12:35

Taha Paksu · Accepted Answer · 2017-11-10 12:40:23Z

4

If you change

x.innerHTML += "the language is, " + choice + "<br>";

to

x.innerHTML += "the language is, " + current.value + "<br>";

it will work.

function choices() {
  var y = document.getElementById("s");
  var x = document.getElementById("output");
  var choice = y.value;
  for (i = 1; i <= 3; i++) {
    var current = y[i];
    if (current.selected == true) {
      x.innerHTML += "the language is, " + current.value + "<br>";

    }
  }
}

<form action="">
  <fieldset>
    <select id="s" multiple="multiple" size="4">
        <option>--Choose language--</option>
        <option value="HTML">HTML</option>
        <option value="JAVA">JAVA</option>
        <option value="PHP">PHP</option>
        </select>
    <input type="button" value="show" onclick="choices()">
  </fieldset>
</form>
<div id="output"></div>

answered Nov 10, 2017 at 12:40

Taha Paksu

15.6k2 gold badges50 silver badges83 bronze badges

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

3 Comments

Taha Paksu Over a year ago

Didn't my answer work? I wrote this answer 10 minutes ago than the others. And it's the same?

Funk Forty Niner Over a year ago

However, maybe the OP may have thought that the other answer provided them with more information (kind of ironic to their post though, lol!), I don't know; I can't speak for them.

Taha Paksu Over a year ago

No problem, your upvotes are more valuable than his accepting right now. He needs to read some rules about using here and why people are giving their precious time to answer questions like this. There are people to help to, and not sometimes.

Tim Klein · Accepted Answer · 2017-11-10 12:49:59Z

1

No need for var choice = y.value;... it is never going to be able to tell you all the choices. As you can see from the rest of your code when you print that variable it only contains the first selection.

Instead just replace:

x.innerHTML += "the language is, " + choice + "<br>";

with

x.innerHTML += "the language is, " + current.value + "<br>";

You are already checking each option for whether it is selected, so simply output the value of each option.

Cheers!

answered Nov 10, 2017 at 12:49

Tim Klein

2,84818 silver badges19 bronze badges

Collectives™ on Stack Overflow

I want to add multiple selection in Javascript

2 Answers 2

3 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related