已选择的“添加目标”按钮将我们引导到下面的界面,允许我们在选择了“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');
答案 0 :(得分:0)
对于技术人员选择,您将使用技术人员数据填充它,如下所示:
@foreach($technicien as $t)
<option value="{{$t->id }}" {{ $t->id ==
$technicien_id ? 'selected = "selected"' : '' }}>
{{$t->user->nom}}
</option>
@endforeach
对于metier select,没有数据传递,因此当你检查select时没有数据可用:
<select onchange="getTachesByMetier(this.value)" style="width:
200px" class="productm form-control" id="metiers">
<option value="">-Select-</option>
</select>
您需要做的是:
技术人员选择在加载时不会更改,因此只有在您手动更改技术人员选择时才会触发onChange()事件。
我希望这能解决你的问题,如果确实如此,请标记我的答案;)