Question

已选择的“添加目标”按钮引导我们进入下面的界面，允许我们在选择与技术人员相关的“metier”和“tache”后添加“tarification”。技术人员ID框自动完成。我的问题是我总是发现“Metier”列表是空的。

但是当我手动选择技师ID时，“metier”列表不再为空。感谢。

请注意，每个技术人员都有一个“metier”列表，每个“metier”都有一个相关的“tache”列表

tarificationcontroller.php

public function create($technicien_id = null)   
{
$technicien = technicien::orderBy('id','desc')->get();
$taches = Tache::orderBy('libelle_tache', 'asc')->get();
$metiers = Metier::orderBy('libelle_metier', 'asc')->get();
>with('technicien', $technicien)->with('metiers', $metiers)- 
>with('technicien_id', $technicien_id);
}

create.blade.php

 @extends('Layouts/app')
 @extends('Layouts.master')
 @section('content')
 @if(count($errors))
 <div class="alert alert-danger" role="alert">
 <ul>
 @foreach($errors ->all() as $message)
 <li>{{$message}}</li>
 @endforeach
 </ul>
 </div>
 @endif
 <script 
 src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js" 
</script>
 <script type="text/javascript">
 var getMetiersByTechnicienUrl = "{{url('/metiersbytechnicien')}}";
 var getTachesByMetierUrl = "{{url('/tachesbymetier')}}";
 //console.log(getMetiersByTechnicienUrl,getTachesByMetierUrl 
 ,getTarificationsByTacheUrl);
 function getMetiersByTechnicien(val) {
 if(val.length>0) {
 var technicien_id = val;
 $.get(getMetiersByTechnicienUrl+'/'+technicien_id,function(res) 
 { var html = '<option value=">-Select-"' ; 
 $.each(res.metiers,function(index,item) { 
 html+=''+item.libelle_metier+''; }); $('#metiers').html(html);

 });
}
}

function getTachesByMetier(val) {
if(val.length>0) {
var metier_id = val;
$.get(getTachesByMetierUrl+'/'+metier_id,function(res) {
    var html = '<option value="">-Select-</option>' ;
    $.each(res.taches,function(index,item) {
        html+='<option 
value="'+item.id+'">'+item.libelle_tache+'</option>';
    });
    $('#taches').html(html);

});
}
}
 </script>
 <div class="container">
 <div class="row"></div>
 <div class="col-md-12">

 <div class="col-md-10">
 <h1>Tarification tache</h1>
 <form action=" {{url ('tarification')  }}" method="post">
 {{csrf_field()}}
 <div class="form-group">
 <label for="technicien">Technicien</label>
   <select onchange="getMetiersByTechnicien(this.value)" 
 name="technicien_id" id="technicien_id" class="form-control">
           <option value="">-Select-</option>
           @foreach($technicien as $t)
                  <option value="{{$t->id }}" {{ $t->id == 
 $technicien_id ? 'selected = "selected"' : '' }}>
                        {{$t->user->nom}}
                  </option>
           @endforeach
    </select>
</div>
<div class="form-group">
<div class="col-md-12">
        <div class="col-md-4">
<label>Metier: </label>
<select onchange="getTachesByMetier(this.value)" style="width: 
200px" class="productm form-control" id="metiers">
    <option value="">-Select-</option>
</select>
        </div>
        <div class="col-md-4">                                      
            <label>tache: </label>
            <select style="width: 200px" class="productname 
form-control" name="tache_id" id="taches">
                <option value="">-Select-</option>
            </select>
        </div>
        <div class="col-md-4">
            <label>tarification: </label>
            <input style="width: 200px" class="productname form- 
control" type="text"  name ="Tarif" class="form-control" value=" 
{{old('tarif')}}">

</div>
</div>
</div>
<div class="form-group">
<input type="submit" value = "enregistrer" class="form-control 
btn btn-primary">
</div>
</div>
    </div>

   </div>
<link 
href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/    
bootstrap.min.css" rel="stylesheet">
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap- 
datepicker/1.5.0/css/bootstrap-datepicker.css" rel="stylesheet">


<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap- 
datepicker/1.5.0/js/bootstrap-datepicker.js"></script>
@endsection

metiercontroler.php

 public function getMetiersByTechnicien($technicien_id)
{

$t = technicien::find($technicien_id);
return response()->json(['metiers' => $t->metier]);
}

route.php

 Route::get('tarification/create/{technicien_id?}', 
'TarificationController@create');

Answer 1

您没有在metier中传递默认选项值

<label>Metier: </label>
<select onchange="getTachesByMetier(this.value)" style="width: 
200px" class="productm form-control" id="metiers">
<option value="">-Select-</option>
</select>

你有technicien_id。您应该在创建时获得相应的metier选项并在视图中传递它们。

或者您可以在页面加载时默认调用getMetiersByTechnicien（）函数，如下所示：

$('document').ready(function(){
    getMetiersByTechnicien($('#technicien_id').val());
});

当id自动完成时，下拉列表为空，当手动选择id时，则为ok

1 个答案: