title: Laravel selected item by javascript
body: <p>When we have html select in laravel we will add code below and it returns database value as selected item:</p>
  
  <pre><code>{{ $category-&gt;id == $product-&gt;category_id ? 'selected' : '' }}
  </code></pre>
  
  <p>like:</p>
  
  <pre><code>&lt;select class="form-control" name="category_id"&gt;
    @foreach($categories as $category)
      &lt;option value="{{ $category-&gt;id }}" {{ $category-&gt;id == $product-&gt;category_id ? 'selected' : '' }}&gt;{{ $category-&gt;title }}&lt;/option&gt;
    @endforeach
  &lt;/select&gt;
  </code></pre>
  
  <p>That's perfect if we use html select but now i am using ajax select and returning data's and i can't get what is set in database as selected option.</p>
  
  <p>here is my codes:</p>
  
  <p><code>html</code></p>
  
  <pre><code>&lt;div class="mt-20"&gt;
    {{ Form::label('category_id', 'Category') }}
    &lt;select class="form-control" name="category_id"&gt;
       &lt;option value=""&gt;Select Category&lt;/option&gt;
         @foreach($categories as $category)
           &lt;option value="{{ $category-&gt;id }}" {{ $category-&gt;id == $product-&gt;category_id ? 'selected' : '' }}&gt;{{ $category-&gt;title }}&lt;/option&gt;
         @endforeach
    &lt;/select&gt;
  &lt;/div&gt;
  
  &lt;!-- sub category --&gt;
  &lt;div class="mt-20"&gt;
    {{ Form::label('subcategory_id', 'Sub Category') }}
    &lt;select class="form-control" name="subcategory_id"&gt;
      &lt;option value=""&gt;Select Sub Category&lt;/option&gt;
    &lt;/select&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><code>javascripts</code></p>
  
  <pre><code>&lt;!-- subcategory --&gt;
  &lt;script&gt;
    jQuery( document ).ready( function( $ ) {
      $('select[name="category_id"]').on('change', function() {
        $.ajaxSetup({
            headers: { 'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content') }
        });
         var CategoryId = $(this).val();
          if(CategoryId) {
              $.ajax({
                url: '{{ url('admin/subcategorylists') }}/'+encodeURI(CategoryId),
                type: "GET",
                dataType: "json",
                success:function(data) {
                  $('select[name="subcategory_id"]').empty();
                  var options = data.map(function(state) {
                      return $("&lt;option class='form-control'&gt;").val(state.id)
                                          .text(state.title);
                  });
                  $('select[name="subcategory_id"]').empty().append(options);
                }
              });
          }else{
            $('select[name="subcategory_id"]').empty().append("&lt;option class='form-control' value='' selected&gt;Select&lt;/option&gt;");
          }
      });
    });
  &lt;/script&gt;
  </code></pre>
  
  <h1>Question</h1>
  
  <ol>
  <li>As my codes are in edit page, I need to get my subcategory select
  <code>with default selected option</code> (which is the value saved in database),
  <strong>how do i do that?</strong></li>
  </ol>