I am developing a backend for a client and I've some <select />
s that works together. Specifically, I've 3 <select />
for select country, province and city (for Spain) that works with other countries too.
If the selected option in country is Spain, province will be populated and if a province is selected city will be populated. If another country is selected in the country select, province and city will remain disabled with no option but with a default value of <option value="0">-- Select--</option>
.
When a country/province/city is selected makes an ajax transaction to get the results. The PHP controller parse the results and if there is results (only for Spain) returns this (to populate province):
<option value="0" >-- Select --</option>
<option value="1" >Andalucía</option>
<option value="2" >Aragón</option>
<option value="3" >Asturias</option>
...
If there is no results for the country selected, the controller returns:
<option value="0" >-- Select --</option>
My question is: how can I handle that if there is ONLY the option with value 0, add an attr("disabled", true); ?
My actual JavaScript code:
$(document).ready(function(){
$("select#codpais").change(function() {
var codpais = $(this).val();
if (0 != codpais) {
$.post(BASE_URL + 'projects/ajax/get_autonomias', { codpais: codpais }, function(data) {
if (data) {
$("select#codauto").attr('disabled', false);
$("select#codauto").html(data);
}
});
}
});
});
The problem is that the controller ALWAYS returns data because the site is bilingual and some users needs to see -- Select -- and others -- Seleccionar -- (if is disabled too).
Thank you in advance!