Próbuję utworzyć dynamiczne menu wyboru, próbowałem napisać kod zarówno w javascript, jak i jquery, ale nie mogę dołączyć opcji w menu rozwijanym. Kiedy próbowałem zobaczyć, co jest zapisane, wyświetlany jest kod HTML Select wraz ze wszystkimi opcjami. Co powinienem w nim dodać lub zmienić, aby opcje były przechowywane we właściwej pozycji?

lines=["B","C","D","E","F","G"];
$(document).ready(function(){
  $("#select1").multiselect({
    placeholder: 'Features'
  });
});    

   // var selectFir = document.getElementById("select1");
      
   // for (var i = 0; i < firstLine.length; i++) {
         // var x = document.createElement("OPTION"), 
           //     txt = document.createTextNode(firstLine[i]);
          // x.appendChild(txt);
          //  x.setAttribute("value", firstLine[i]);
          //  selectFir.appendChild(x);
          //  selectFir.insertBefore(x, selectFir.lastChild);
   //  }console.log(selectFir);

firstLine = lines[0];
// Calls function to generate drop downs using options above
       for(var i=0; i< firstLine.length;i++)
       {
        //creates option tag
         jQuery('<option/>', {
               value: firstLine[i],
               html: firstLine[i]
               }).appendTo('#select1'); 
       }
       jQuery('#select1').multiselect('refresh');
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/multiselect/2.2.9/js/multiselect.min.js"></script>
<select multiple id="select1">
 <option value="A">A</option>
</select>
0
shruti 19 listopad 2019, 17:30
Wygląda na to, że nie możesz się doczekać umieszczenia kodu po tej „// Wywołuje funkcję generującą listy rozwijane przy użyciu powyższych opcji” w funkcji jakiegoś zdarzenia kliknięcia, prawda?
 – 
jagdish.narkar
19 listopad 2019, 18:59
Tak, problem polega na tym, że widzę cały tag select w kodzie html, kiedy wyświetlam selectFir, nie jest to wciskanie opcji w tagu opcji. Czy istnieje wtyczka jquery, która może zapełniać dynamiczne menu rozwijane?
 – 
shruti
19 listopad 2019, 20:19
Czy kod rozwiązania, który podałem, nie odpowiada na twoje pytanie?
 – 
jagdish.narkar
21 listopad 2019, 17:28
O tak, to pomogło, przepraszam, że nie odpowiedziałem, i dziękuję!
 – 
shruti
21 listopad 2019, 19:51

1 odpowiedź

lines=["B","C","D","E","F","G"];
$(document).ready(function(){
  $("#select1").multiselect({
    placeholder: 'Features'
  });
});    

   // var selectFir = document.getElementById("select1");
      
   // for (var i = 0; i < firstLine.length; i++) {
         // var x = document.createElement("OPTION"), 
           //     txt = document.createTextNode(firstLine[i]);
          // x.appendChild(txt);
          //  x.setAttribute("value", firstLine[i]);
          //  selectFir.appendChild(x);
          //  selectFir.insertBefore(x, selectFir.lastChild);
   //  }console.log(selectFir);

firstLine = lines;
// Calls function to generate drop downs using options above
       for(var i=0; i< firstLine .length;i++)
       {
        //creates option tag
         jQuery('<option/>', {
               value: firstLine[i],
               html: firstLine[i]
               }).appendTo('#select1'); 
       }
       jQuery('#select1').multiselect('refresh');
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/multiselect/2.2.9/js/multiselect.min.js"></script>
<select multiple id="select1">
 <option value="A">A</option>
</select>
1
jagdish.narkar 19 listopad 2019, 18:56