У меня есть несколько блоков выбора, и данные каждого из них возвращаются на основе предыдущего параметра блока выбора.
Раньше у меня было 3 блока выбора, и все работало просто отлично, теперь мне нужно добавить дополнительный блок выбора, чтобы те старые блоки выбора все еще работали нормально, но этот новый возвращает TypeError: e.nodeName is undefined
Скриншот
Может быть, это изображение может объяснить лучше

код
Javascript
Чтобы сделать код короче и чище, я удалил ненужные части и прокомментировал, что делает каждая часть.
Часть текущего выпуска function substricsfunction(){
<script>
$(document).ready(function() {
$('#province').on('change', function() {
var provinceID = $(this).val();
//ajax cal to return city names when state name changes (no. 2 image above)
});
});
jQuery( document ).ready( function( $ ) {
$('body').on('change', '#city', function(e){
$.ajaxSetup({
headers: { 'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content') }
});
var cityID = $(this).val();
var weight = ["{{$totalWeight}}"];
if(cityID) {
$.ajax({
url: '{{ url('rajaajax') }}/'+weight+'/'+encodeURI(cityID),
type: "GET",
dataType: "json",
success:function(data) {
//return data in select-box (no.4 image above)
}
});
//custom function
myfunction();
substricsfunction();
}else{
$('select[name="postchoose"]').empty().append("<option value='' selected>Pilih</option>");
}
});
});
function myfunction(){
//return some more data in select-box (no.4 image above)
};
//newpart ( we work on this now )
function substricsfunction(){
$.ajaxSetup({
headers: { 'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content') }
});
var hfg = $(this).val();
if(hfg) {
$.ajax({
url: '{{ url('rajaajaxsubdistrict') }}/'+encodeURI(hfg),
type: "GET",
dataType: "json",
success:function(data) {
console.log(data);
//
$('select[name="subdistrict"]').empty().append("<option value='' selected>Pilih</option>");
$.each(data.data, function(key, value) {
$.each(value.data, function(key2, value2) {
$('select[name="subdistrict"]').append('<option id="subdistrict" class="form-control" value="'+ value2.subdistrict_id +'">'+ value2.subdistrict_name +'</option>');
});
});
//
}
});
}
};
//newpart
</script>
Больше знать
URL {{ url('rajaajaxsubdistrict') }}/'+encodeURI(hfg)
, равный site.trg/rajaajaxsubdistrict/27
, возвращает данные как

Так что моя ошибка TypeError: e.nodeName is undefined
не в бэк-энде, что не так, просто в этой функции.
Есть идеи?