how to select automatically first value of dropdown in select input?

You can use the $loop object that is available in foreach inside a blade file. See https://laravel.com/docs/5.6/blade#the-loop-variable

<select name="c_id" id="c_id" class="form-control input dynamic" data-dependent="b_id" >
    @foreach($model_list as $model) 
      <option value="{{$categories->id}}" {{ $loop->first ? 'selected="selected"' : '' }}>{{$categories->id}}</option>
    @endforeach
  </select>

<option value="{{$categories->id}}"@if ($loop->first) selected @endif>{{$categories->id}}</option>

https://laravel.com/docs/5.6/blade#the-loop-variable

@foreach($model_list as $model) 
      <option value="{{$categories->id}}" @if ($loop->first) selected @endif>{{$categories->id}}</option>
@endforeach 

@foreach($model_list as $model) 
    @if ($loop->first)
        <option value="{{$categories->id}}" selected>
    @else
        <option value="{{$categories->id}}">
    @endif 
@endforeach 

You could use ternary operator

@click with html5 you just need selected not selected="selected". Same for checked and a few other props that are basically just on/off values.

@Cronix is your code correct please check..because in my Id (sublime) display some color change on @if anf @endif

@Sergiu17 in your code I did not see any value in my select input

@Flex no way, here's is the documentation https://laravel.com/docs/5.6/blade#the-loop-variable

@flex yes I tested it before posting.

actually I need javascript select to my selection input because In my application other dependent selection inputs are working on this selection inputs values

still I did not get result. I should select it manually. only after select value manually other selection inputs are working.

If you're just using javascript, you just need to trigger a change event on that dropdown after the page loads. That is equivalent to you manually changing it. If you have everything set up right, that should trigger your other events that listen to that change event on the dropdown we're talking about.

@Cronix can you give me some sample code ?

How are you doing it now? You apparently have a change event listener on the dropdown you're talking about as you mentioned if you change the value manually, it does something to the other inputs. Show your code. I don't know if your using a js library or vanilla js or what.

If you're using jQuery, it would just be a simple $('#c_id').change();

@Cronix ok, this is my code here in my controller,

public function show($id)
    {
$model_list = DB::table('brand')

                     ->groupBy('c_id')
                     ->get();
}

function fetch1(Request $request)
    {
        $select = $request->get('select');
        $value = $request->get('value');
        $dependent = $request->get('dependent');
        $data = DB::table('brand')
               ->where($select,$value)
               ->groupBy($dependent)
               ->get();

               $output = '<option value="">Select '.ucfirst($dependent).'</option>';
               foreach ($data as $row) {
                $output .= '<option value="' .$row->$dependent. '">
                          '.$row->$dependent.'</option>';
               }
               echo $output;
    }

and in my blade file

<div class="form-group">
            <label for="exampleFormControlSelect1">Vehicle Category</label>
        <select name="c_id" id="c_id" class="form-control input dynamic" data-dependent="b_id" >
            
            @foreach($model_list as $model) 
            <option value="{{$categories->id}}">{{$categories->id}}</option>
            @endforeach
            
          
        </select>

        </div>

         <div class="form-group">
            <label for="exampleFormControlSelect1">Brand</label>

           <select name="b_id" id="b_id" class="form-control input dynamic" data-dependent="na" >
            <option value="">Select District</option>
            
        </select>
        </div>

        <div class="form-group">
            <label for="exampleFormControlSelect1">Model</label>
        <select name="na" id="na" class="form-control input">
            <option value="">Select Town</option>
            
        </select>
        </div>

<script>
    $(document).ready(function(){
        $('.dynamic').change(function(){
        if($(this).val() != '')
        {
            var select = $(this).attr("id");
            var value = $(this).val();
            var dependent = $(this).data('dependent');
            var _token = $('input[name="_token"]').val();
            $.ajax({
                url:"{{ route('cars.carform.fetch1')}}",
                method:"POST",
                data:{select:select, value:value, _token:

                    _token, dependent:dependent},
                    success:function(result)
                    {
                        $('#'+dependent).html(result);
                    }
            })
        }
        });

I don't see anywhere in your js that you are doing anything to the input we're discussing in your original post.

What does this mean?

still I did not get result. I should select it manually. only after select value manually other selection inputs are working.

@Cronix I mean I can see value in the input box. ($categories->id) but as a result of that other depending selection boxes are not working. when I select values manually again then, it is working. so, I need fix this problem... I mean same result after your answers and currently my codes also...

remove the code that we already used to select the first element in the view file in the loop. Then as first line of your js, select it with js. Maybe that will help. Not sure as Im still not understanding everything here and we've deviated from your original question, which was answered properly.

$(document).ready(function(){
    // select first option in #c_id dropdown
    $("#c_id").val($("#c_id option:first").val());

    $('.dynamic').change(function(){
    // ..rest of your code

@Cronix same result....