return data from a select in the modal

Question

Do insert, update and select with modal. When I edit load the data returned in inputs, in checkbox, us textarea, but we select does not load the information.

Code where I query the data and create the button editar:

$result = mysqli_query($conn, $query);  
$output;
while($row = mysqli_fetch_array($result))  
 {  
   $output .= '

         <form id="insert_form">
             <div class="row clearfix">
                 <div class="col_half1">
                     <label>Código Utente</label>
                        <div class="input_field"> <span><i aria-hidden="true" class="fa fa-file-code"></i></span>
                        <input type="text" id="codigo1" name="codigo" value="'.$row["codigo"].'" class="form-control" readonly="true"/>
                        </div>
                 </div>
                 <div class="col_half">
                     <label>Dependência</label>
                        <div class="input_field"> <span><i aria-hidden="true" class="fa fa-info-circle"></i></span>
                        <input type="text" id="dependencia2" name="dependencia" value="'.$row["Dependencia"].'" class="form-control" readonly="true"/>
                        </div>
                 </div>
             </div>
             <div class="modal-footer" >
                 <button type="button" class="btn btn-danger" data-dismiss="modal">Cancelar</button> 
                 <a type="button" name="edit" id="'.$row["Id"].'" data-toggle="modal" href="#add_data_Modal" onclick="inserir_registo()" class="btn btn-primary edit_data">Editar</a>                        
             </div>     
             </form>
             ';  
         }

      $output;
     echo $output;  
    }  

To send the data to form from modal to editar do it this way:

$(document).on('click', '.edit_data', function(){  
 var employee_id = $(this).attr("Id");
   $.ajax({  
        url:"./fetchutente",  
        method:"POST",  
        data:{employee_id:employee_id},             
        dataType:"json",  
        success:function(data){
          $('#codigo').val(data.codigo);
          $('#dependencia1').val(data.Dependencia);
          $('#employee_id').val(data.Id);                    
          $('#insert').val("Gravar");  
          $('#add_data_Modal').modal('show');
          }  
      });
    }); 

The form of the modal that opens to editar:

<form id="formulario"> 
    <div class="row clearfix">
        <div class="col_half1">
          <label>Código Utente</label>
          <div class="input_field"> <span><i aria-hidden="true" class="fa fa-code"></i></span>
            <input type="text" class="form-control" id="codigo" name="codigo" placeholder="Código Utente" required="">
          </div>
        </div>
     </div>
     <div class="row clearfix">
     <div class="col_half3">
          <label>Dependência</label>
          <div class="input_field"> <span><i aria-hidden="true" class="glyphicon glyphicon-info-sign"></i></span>
            <select class="form-control" name="dependencia" id="dependencia1" placeholder="Dependência" required="">
               <option></option>
               <?php        
               $sql = "SELECT * FROM raddb.Dependencia ORDER BY Discricao ASC";
               $qr = mysqli_query($conn, $sql);
               while($ln = mysqli_fetch_assoc($qr)){
               echo '<option value="'.$ln['Id'].'">'.$ln['Discricao'].'</option>';
               }
               ?>      
            </select>
          </div>
        </div>
      </div>
</form> 

But as I show in the image, it loads the information from input with the code, but the select with name=dependencia, goes blank:

I tried that too, but it also doesn’t carry the information from json:

$('select[name="dependencia"]').val(data.Dependencia);

Answer 1

Instead of doing this:

$('select[name="dependencia"]').val(data.Dependencia);

You’d have to do it

$('select[name="dependencia"]').val(data.DependenciaId);

so he can find the one option within your select with the same value you want to set