title: How to prefill fields using jquery
body: <p>Hi I'm trying to figure out how to fill all fields using ajax call, it successfully doing by selecting category, it loads all related sub_categories.</p>
  <p>But <code>sub_sub_category</code> fields are empty. Only when I choose <code>sub_category</code> option it will load all <code>sub_sub_categories</code>, but I want all prefilled once category has been changed. I don't mind to leave like this, but problem is if I have only single <code>sub_category</code> I can not select any <code>sub_sub_category</code> even if they have any I tried to convert to function and call them but no success.</p>
  <p>Code below:</p>
  <pre><code>&lt;script&gt;
      $(document).ready(function() {
          get_sub_sub_category();
          $('select[name=&quot;category_id&quot;]').on('change', function() {
              var category_id = $(this).val();
              if(category_id) {
                  $.ajax({
                      url: &quot;{{ url('/category/sub-category/') }}/&quot;+category_id,
                      type: &quot;GET&quot;,
                      dataType: &quot;json&quot;,
                      success: function(data) {
                          $('select[name=&quot;sub_sub_category_id&quot;]').html('');
                          var d = $('select[name=&quot;sub_category_id&quot;]').empty();
  
                          $.each(data, function(key, value) {
                              $('select[name=&quot;sub_category_id&quot;]').append('&lt;option value=&quot;'+ value.id +'&quot;&gt;' + value.sub_category_name + '&lt;/option&gt;');
                          });
                          get_sub_sub_category();
                      },
                  })
              } else {
                  alert('danger');
              }
          });
  
  
          function get_sub_sub_category() {
              $('select[name=&quot;sub_category_id&quot;]').on('load change', function () {
                  var sub_category_id = $(this).val();
                  if (sub_category_id) {
                      $.ajax({
                          url: &quot;{{ url('/category/sub-sub-category/') }}/&quot;+sub_category_id,
                          type: &quot;GET&quot;,
                          dataType: &quot;json&quot;,
                          success: function (data) {
                              var d = $('select[name=&quot;sub_sub_category_id&quot;]').empty();
                              $.each(data, function (key, value) {
                                  $('select[name=&quot;sub_sub_category_id&quot;]').append('&lt;option value=&quot;' + value.id + '&quot;&gt;' + value.sub_sub_category_name + '&lt;/option&gt;');
                              });
                          },
                      })
                  } else {
                      alert('danger');
                  }
              });
          }
      });
  
  &lt;/script&gt;
  </code></pre>