Hola, estoy tratando de descubrir cómo llenar todos los campos usando la llamada ajax, lo hace con éxito al seleccionar la categoría, carga todas las subcategorías relacionadas.

Pero los campos sub_sub_category están vacíos. Solo cuando elijo la opción sub_category , cargará todas las sub_sub_categories , pero quiero que todas se completen previamente una vez que se haya cambiado la categoría. No me importa dejarlo así, pero el problema es que si solo tengo una sub_category , no puedo seleccionar ninguna sub_sub_category , incluso si tienen alguna. Intenté convertirla en función y llamarla, pero no tuve éxito.

Código a continuación:

 <script> $(document).ready(function() { get_sub_sub_category(); $('select[name="category_id"]').on('change', function() { var category_id = $(this).val(); if(category_id) { $.ajax({ url: "{{ url('/category/sub-category/') }}/"+category_id, type: "GET", dataType: "json", success: function(data) { $('select[name="sub_sub_category_id"]').html(''); var d = $('select[name="sub_category_id"]').empty(); $.each(data, function(key, value) { $('select[name="sub_category_id"]').append('<option value="'+ value.id +'">' + value.sub_category_name + '</option>'); }); get_sub_sub_category(); }, }) } else { alert('danger'); } }); function get_sub_sub_category() { $('select[name="sub_category_id"]').on('load change', function () { var sub_category_id = $(this).val(); if (sub_category_id) { $.ajax({ url: "{{ url('/category/sub-sub-category/') }}/"+sub_category_id, type: "GET", dataType: "json", success: function (data) { var d = $('select[name="sub_sub_category_id"]').empty(); $.each(data, function (key, value) { $('select[name="sub_sub_category_id"]').append('<option value="' + value.id + '">' + value.sub_sub_category_name + '</option>'); }); }, }) } else { alert('danger'); } }); } }); </script>