'Why my filter is not working when i am selecting any option but it is working for another control
I am filtering the select box value based on the selection of the previous select box. My code is working for option 1 to option 2 but it is not working from option 2 to option 3. please look and suggest.
var allOptions = $("#option2 option");
$("#option1").change(function () {
$("#option2 option").remove();
$("select").prop("disabled", false);
$(".error-message").hide();
var classN = $("#option1 option:selected").prop("class");
var opts = allOptions.filter("." + classN);
$.each(opts, function (i, j) {
$(j).appendTo("#option2");
});
});
var allOptions2 = $("#option3 option");
$("#option2").change(function () {
$("#option3 option").remove();
$("select").prop("disabled", false);
$(".error-message").hide();
var classN2 = $("#option2 option:selected").prop("class");
var opts2 = allOptions2.filter("." + classN2);
$.each(opts2, function (k, l) {
$(l).appendTo("#option3");
});
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select id="option1" class="mandatory form-select mb-3">
<option value="0"></option>
<option class="australia">Australia</option>
<option class="austria">Austria</option>
</select>
<select id="option2" class="mandatory form-select mb-3">
<option value="0"></option>
<option class="australia l-a">Bachelor (honours) Degree</option>
<option class="australia austria cyprus czech-republic denmark dubai finland germany hungary ireland malaysia japan mauritius malta singapore paris netherland poland switzerland singapore sweden spain">Bachelors</option>
<option class="austria cyprus czech-republic denmark dubai finland germany hungary ireland malaysia japan mauritius malta singapore paris netherland poland switzerland singapore sweden spain uk usa">Masters</option>
<option class="australia l-b">Masters (extended) degree</option>
<option class="australia">Masters by coursework degree</option>
<option class="australia austria canada cyprus czech-republic denmark dubai finland germany hungary ireland malaysia japan mauritius malta singapore paris netherland poland switzerland singapore sweden spain uk">PhD</option>
<option class="australia">Vocational Education and Training (VET)</option>
</select>
<select id="option3" class="form-select mb-3">
<option></option>
<option class="italy">Any Qualifying</option>
<option class="italy">PHd</option>
<option class="australia l-b">PG</option>
<option class="australia l-a">UG</option>
</select>
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|
