There is a <select> on the page.

 <div id="weeklyID" class=" multisel-container"> <label class=" multisel-label" for="groupFormReportsInput">Назначьте показатели</label> <div class=" select-container"> <select id="selectId" class="multisel selectpicker" multiple name="week_days"> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> <option value="6">6</option> <option value="7">7</option> <option value="1">1</option> </select> </div> </div>

it has a multisel selectpicker function ( multisel selectpicker )

there is a button next to

 <input type="button" value=" >> " onclick="isUserId()">

when pressed in the next div

 <div id='resultId'></div>

selected options should be displayed

written here is such a simple js

 function isUserId() { let id = document.getElementById('selectId'); let selectShiftTypeId = id.value; document.getElementById('resultId').innerHTML = selectShiftTypeId; }

Currently, when selecting multiple elements in <select> , only one is displayed. And how to rewrite the code so that all the selected elements are displayed?

    2 answers 2

     function isUserId() { document.getElementById('resultId').innerHTML = Array.prototype.slice.call(document.querySelectorAll('#selectId option')).filter(option => option.selected).map(x => x.value).join(); } 
     option { width: 50px; } 
     <div id="weeklyID" class=" multisel-container"> <label class=" multisel-label" for="groupFormReportsInput">Назначьте показатели</label> <div class=" select-container"> <select id="selectId" class="multisel selectpicker" multiple name="week_days"> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> <option value="6">6</option> <option value="7">7</option> <option value="1">1</option> </select> </div> </div> <br> <input type="button" value="click me" onclick="isUserId()"> <br> <div id='resultId'></div> 

       function isUserId() { let id = document.getElementById('selectId'); let selectShiftTypeId=''; for(var val of id.selectedOptions){ selectShiftTypeId+=val.value; } document.getElementById('resultId').innerHTML = selectShiftTypeId; }