0

First to filter the first 3 dropdowns menus, I used the code found on this page

I can also filter the next 3 as well, but I don't know how to get the selected data from the first 3 menus (Year 1) and show in the next 3 menus (Year 2) only the 3 selected options in Year 1. All the options are the same in all dropdown menus.

Example: Year 1 dropdown 1 : Red; dropdown 2 : Blue and Dropdown 3 : Yellow.

How can i find in Year 2 Dropdown 1 only the 3 options selected previously (Red, Blue, Yellow) and hide the others, idem for Year 2 Dropdown 2 and Year 2 Dropdown 3 (options must also be filtered to avoid multiple selection for Year 2)

Fiddle

$(document).ready(function() {

  $("select").on('focus', function() {
    $("select").find("option[value='" + $(this).val() + "']").attr('disabled', false);
  }).change(function() {

    $("select").not(this).find("option[value='" + $(this).val() + "']").attr('disabled', true);

  });


});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<p>

  YEAR 1
  <select id="y1sp1" name="indication_subject[]">
    <option></option>
    <option value="1"> Red</option>
    <option value="2"> Blue</option>
    <option value="3"> Yellow</option>
    <option value="4"> Black</option>
  </select>

  <select id="y1sp2" name="indication_subject[]">
    <option></option>
    <option value="1"> Red</option>
    <option value="2"> Blue</option>
    <option value="3"> Yellow</option>
    <option value="4"> Black</option>
  </select>

  <select id="y1sp3" name="indication_subject[]">
    <option></option>
    <option value="1"> Red</option>
    <option value="2"> Blue</option>
    <option value="3"> Yellow</option>
    <option value="4"> Black</option>
  </select>

</p><p>

  YEAR 2
  <select id="y2sp1" name="indication_subject[]">
    <option></option>
    <option value="1"> Red</option>
    <option value="2"> Blue</option>
    <option value="3"> Yellow</option>
    <option value="4"> Black</option>
  </select>

  <select id="y2sp2" name="indication_subject[]">
    <option></option>
    <option value="1"> Red</option>
    <option value="2"> Blue</option>
    <option value="3"> Yellow</option>
    <option value="4"> Black</option>
  </select>

  <select id="y2sp3" name="indication_subject[]">
    <option></option>
    <option value="1"> Red</option>
    <option value="2"> Blue</option>
    <option value="3"> Yellow</option>
    <option value="4"> Black</option>
  </select>
</p>
mplungjan
  • 169,008
  • 28
  • 173
  • 236

0 Answers0