Select field not appending data hi. I have a dependent dropdown. when selecting division it will show the districts included in that division but it is not appending select data. Blade file:
<div class="form-group">
<label for="division">Division</label>
<select class="form-control" name="division" id="division">
@foreach($division as $div)
<option value="{{ $div->division }}">{{ $div->division }}</option>
@endforeach
</select>
</div>
<div class="form-group">
<label for="district">District</label>
<select class="form-control" name="district" id="district">
</select>
</div>
script:
<script>
$(document).ready(function() {
$('#division').on('change', function() {
var division = $(this).val();
if(division) {
$.ajax({
url: "<?= url('/admin/getdistrict/') ?>/" + division,
type: "GET",
data : {"_token":"{{ csrf_token() }}"},
dataType: "json",
success:function(data)
{
console.log(data);
if(data){
$('#district').empty();
$('#district').append('<option hidden>Choose district</option>');
$.each(data, function(key, district){
$('select[name="district"]').append('<option value="'+ district.district +'">' + district.district+ '</option>');
});
}else{
$('#district').empty();
}
}
});
}else{
$('#district').empty();
}
});
</script>
the data is showing in the console. and if i append it in a div then also the data are showing. only when i use select the data is not appending.
It looks like the issue could be with the way you are appending options to the "district" select field. Instead of using "$('select[name="district"]').append()", you should use "$('#district').append()".
script:
$(document).ready(function() {
$('#division').on('change', function() {
var division = $(this).val();
if(division) {
$.ajax({
url: "/" + division,
type: "GET",
data: { "_token": "{{ csrf_token() }}" },
dataType: "json",
success: function (data) {
console.log(data);
if (data) {
$('#district').empty();
$('#district').append('Choose district');
$.each(data, function (key, district) {
$('#district').append('' + district.district + '');
});
} else {
$('#district').empty();
}
}
});
} else {
$('#district').empty();
}
});
});
Please sign in or create an account to participate in this conversation.