Here it is: You need to use the select event of jquery autocomplete:
$( "#kapitel" ).autocomplete({
source: availableKapitel,
select: function (event, ui) {
$('#subkap').prop('disabled',false);
}
});
Question
Yeah, I know this question sounds like there are already lots of other threads where it already has been answered. But unfortunately not. In this case I have a JQ function which autocompletes the users input. Like if the user types "Ph" the full subject "Physics" is already shown in a JQ dropdown under the input field. The user will have to select more information than just this first input, like a sub-genre of the firstly selected subject. The sub-genre field is disabled first, so the user can't make anything wrong and of course the sub-genres depend on the first choice. So how can I activate/enable this dropdown selection, when having the first JQ input like that:
$(function() {
var availableKapitel = [
"Analytische Geometrie",
"Angewandte Mathematik",
"Bruchrechnung und rationale Zahlen",
"etc."
];
$( "#kapitel" ).autocomplete({
source: availableKapitel
});
});
I tried it with something like that, but of course that won't work, since I don't know how to tell one of the choices above how to act like they would have a specific ID
$("#kapitel").click(function() {
$("availableKapitel").attr("enabled", true);
});
The disabled dropdown menu which should be enabled after chosing one of the options from the JQ auto-complete dropdown, looks like this:
<div class="ui-widget" id="sub">
<label for="kapitel">Unterkapitel</label><br/>
<select disabled="disabled" id="subkap">
<option>--Zuerst Fach/Kapitel auswählen--</option>
<option>Ähnliche Dreiecke</option>
<option>Cosinus</option>
<option>etc.</option>
</select>
</div>
Solution
Here it is: You need to use the select event of jquery autocomplete:
$( "#kapitel" ).autocomplete({
source: availableKapitel,
select: function (event, ui) {
$('#subkap').prop('disabled',false);
}
});