title: Laravel Dynamic Dependent Dropdown
body: <p>I need to add a Laravel Dynamic Dependent Dropdown. Im confused..
  In my database, i have both categories and their childrens.</p>
  
  <ul>
  <li>Account_id =0  => Categorie </li>
  <li>Account_id =1 => Sub Categorie of  category or subcategory with id =1</li>
  <li>Account_id =2 => Sub categorie of  category or subcategory with id =2</li>
  </ul>
  
  <p>This is my actual code :</p>
  
  <p>Method:</p>
  
  <pre><code> public function index()
   {
      $categories = Account::where('account_id', '=', 0)-&gt;get();
      $allCategories = Account::where('account_id', '=', 0)- 
    &gt;pluck('account_name','id');
       return view('Account.list',compact('categories', 'allCategories')); // 
    set the path of you templates file.
  
    }
  
  public function children(Request $request)
  {
      return Account::where('account_id', $request-&gt;account_id)-&gt;pluck('account_name', 'id');
  }
  </code></pre>
  
  <p>View: </p>
  
  <pre><code>                                 &lt;div class="form-group"&gt;
       {!! Form::label('account_id', 'Parent Category:')!!}
       {!! Form::select('account_id', $allCategories,  ['placeholder' =&gt; 
       'Choose Category'])!!}
          &lt;/div&gt;
  
  
                                  &lt;div class="form-group"&gt;
       {!! Form::label('children', 'Child category:')!!}
       {!! Form::select('children', [], null, ['placeholder' =&gt; 'Choose child 
       category'])!!}
      &lt;/div&gt;
  </code></pre>
  
  <p>Route:</p>
  
  <pre><code>Route::get('/categories', [
     'uses' =&gt; 'AccountController@index',
     'as' =&gt; 'categories'
   ]);
   Route::get('/categories/children', [
     'uses' =&gt; 'AccountController@children',
     'as' =&gt; 'categories.children'
   ]);
  </code></pre>
  
  <p>JS:</p>
  
  <pre><code> &lt;script&gt;
  $('#account_id').change(function(e) {
      var parent = e.target.value;
      $.get('/categories/children?account_id=' + account_id, function(data) {
          $('#children').empty();
          $.each(data, function(key, value) {
              var option = $("&lt;option&gt;&lt;/option&gt;")
                    .attr("value", key)                         
                    .text(value);
  
              $('#children').append(option);
          });
      });
  });
  &lt;/script&gt;
  </code></pre>