Flex's avatar
Level 4

how to select value automatically to dropdown select input?

in my laravel app I have following dynamically depending selection inputs,

  <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="{{$model->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>

above my system I have create dynamically depending drop-down selection box. child selection boxes values are working according to first parent selection value. but I should manually select first parent values. now I need automatically select parent values when windows opening. how can I do this.

jquery for my selection box

<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);
                    }
            })
        }
        });
      
    });
</script>
0 likes
4 replies
Flex's avatar
Level 4

@click yes I think yesterday question is much complex to audience I simplify it.

lostdreamer_nl's avatar
Level 53

Try this:


    $(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);
                    }
            })
        }
        }).trigger('change'); // this wil trigger the change above on page load
      
    });
1 like

Please or to participate in this conversation.