How to load data from the selected item?

Context: Home How to load data from a selected template? Is JavaScript required? If so, should the code be in an external file or in the same code?

HomeWhenthetemplateisselected,thetemplateitemsmustbeloaded.Asshowninthefollowingimage.


Codeinhtmledita.blade.php:

<divclass="modal fade modal-default" id="modalGerarChecklist" aria-hidden="true" aria-labelledby="examplePositionCenter"
                 role="dialog" tabindex="-1">
                <div class="modal-dialog modal-center">
                    <div class="modal-content">
                        <div class="modal-header">
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                <span aria-hidden="true">×</span>
                            </button>
                            <h4 class="modal-title">Gerar Checklists</h4>
                        </div>
                        <div class="modal-body">
                        <div class="form-group col-md-18">
                             <input type="hidden" id="idProjeto" name="idProjeto" value="{{$projeto->id}}">
                             <label class="control-label">Modelos</label>
                            <select class="form-control" id="idModelo" name="idModelo"  required>
                                <option value="">Selecione</option>
                                @foreach($checklistsModelos as $checklistModelo)
                                    <option value="{{$checklistModelo->id}}" {{old('checklistModelo') == $checklistModelo->id ? 'selected' : ''}}>{{$checklistModelo->modelo}}</option>
                                @endforeach
                            </select> 
                            <br/>
                           <label class="control-label">Itens</label>
                            <select class="form-control" id="comboItens" name="comboItens"  multiple='multiple' disabled>
                            </select> 

                         </div>


                        </div><!--Fim do modal-body-->

                        <div class="modal-footer">
                        <center>
                            <a id="btnGerarChecklist" type="button" class="btn btn-primary gerarChecklist" data-dismiss="modal"  align="center" style="width: 300px; height: 40px">Gerar</a>
                        </center>
                        </div>
                    </div>
                </div>
            </div>
  <!--Fim do modal de Gerar Checklist--> 

  <script src="{{asset('js/jquery-2.2.3.min.js')}}"></script> 


   <script>

     $(function(){

         jQuery("#idModelo").change(function(){

            var idModelo = jQuery(this).val();
            jQuery.getJSON("/projetos/comboItens/"+idModelo,function(data){
               jQuery.each(data, function(key, value){
                   alert(jQuery("#comboItens").append("<option value="+value.id+">"${value.descricao_item}"<option/>"));

               });
            });

            //jQuery("#comboItens").attr("disabled",false);


         });

     });

   </script>

ComboController.php Controller comboItem method

 public function comboItens($id)
      {
        $checklistEstrutura = DB::table('checklist_estrutura')
        ->join('checklist_modelo', 'checklist_modelo.id', '=', 'checklist_estrutura.modelo_id')
        ->join('checklist_itens', 'checklist_itens.id', '=', 'checklist_estrutura.itens_id')
        ->select('checklist_itens.id', 'checklist_itens.descricao_item')
        ->where('modelo_id','=', $id)
        ->groupBy('checklist_estrutura.estrutura_id', 'checklist_itens.descricao_item')
        ->distinct()
        ->get(); 

         $checklistEstruturaArray = (array)  array_values($checklistEstrutura->toArray()) ; 

        $checklistEstruturaModelo =  ChecklistEstrutura::where('modelo_id', '=', $id)->first();

        //é necessário retornar um response em json


       return response()->json($checklistEstruturaModelo);

      }

Routes web.php

$this->group(['middleware' => ['auth'], 'namespace' =>'admin','prefix'=>'projetos'], function(){

    $this->get('comboItens/{id}', 'ProjetoController@comboItens')->name('projeto.comboItens');

   //Final das Rotas de gerenciar projetos
});

Database structure