1

here i use select option in one function is it possible? here I don't just use 4 select options but it can be 10 or unlimited, what's the best way?

my code :

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.7/css/select2.min.css" rel="stylesheet">

<select id="selectss" style="width: 100%;">
    <option value="1">01</option>
    <option value="2">02</option>
    <option value="3">03</option>
</select>
<br><br><br>
<select id="selectss" style="width: 100%;">
    <option value="1">04</option>
    <option value="2">05</option>
    <option value="3">06</option>
</select>
<br><br><br>
<select id="selectss" style="width: 100%;">
    <option value="1">07</option>
    <option value="2">08</option>
    <option value="3">09</option>
</select>
<br><br><br>
<select id="selectss" style="width: 100%;">
    <option value="1">Test</option>
    <option value="2">Test</option>
    <option value="3">Test</option>
</select>

<script type="text/javascript" src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.7/js/select2.min.js"></script>

<script>
    $(document).ready(function() {
       $("#selectss").select2();
    });
</script>

Previously I used the code below, but this is not the best way because it has to change all the ids in the select option :

<script>
    $(document).ready(function() {
        $("#selectss1, #selectss2, #selectss3, #selectss3, #selectss4").select2();
    });
</script>
Kyun
  • 692
  • 3
  • 11

1 Answers1

1

Please use this method.

$(".selectss").select2();

Please change id to class. This adds select2 to all elements with class containing "selectss". You should not have duplicate IDs

Kirill Savik
  • 1,228
  • 4
  • 7
  • I looked everywhere and finally it's just like this, thank you this is very helpful – Kyun Aug 05 '21 at 03:35