how to make a dropdown list only options in relation with the chosen "Metier"? - laravel

Question

I have this form and then I have in my database a set of "taches" that is linked to each "metier", I want to choose a "metier" in the field and the following field "taches" to propose me to choose only "taches" related to this "metier". Here is my code and my form.I would be very grateful if someone could help me with this.
create.blade.php
#extends('Layouts/app')
#extends('Layouts.master')
#section('content')
#if(count($errors))
<link rel="stylesheet"
href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<div class="alert alert-danger" role="alert">
<ul>
#foreach($errors ->all() as $message)
<li>{{$message}}</li>
#endforeach
</ul>
</div>
#endif
<div class="container">
<div class="row">
<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 name="technicien_id" id="technicien" class="form-control" >
#foreach($techniciens as $techniciens)
<option value="{{ $techniciens->id }}">
{{$techniciens->id}}
</option>
#endforeach
</select>
</div>
////////////
{{Form::open(array('url'=>'','files'=>true))}}
<div class="form-group">
<label for="metier">Libelle metier</label>
<select name="metier" id="metier" class="form-
control">
#foreach($metiers as $metier)
<option value="{{ $metier->id }}">
{{$metier->libelle_metier}}
</option>
#endforeach
</select>
</div>
<div class="form-group">
<label for="Tache">Libelle Tache</label>
<select name="tache" id="Tache" class="form-control">
#foreach($taches as $tache)
<option value="{{ $tache->id }}">
{{$tache->libelle_tache}}
</option>
#endforeach
</select>
</div>
{{Form::close()}}
//////////////
<div class="form-group">
<label for="">Tarif</label>
<input type="text" name ="Tarif" class="form-control"value="{{old('tarif')}}">
</div>
<div class="form-group">
<input type="submit" value = "enregistrer" class="form-control btn btn-primary">
</div>
</form>
</div>
</div>
<script>
$('#metier').on('change',function(e){
console.long(e);
var met_id = e.target.value;
$.get('/ajax-tac?met_id=' + met_id, function(data){
$('#tache').empty();
$.each(data,function(index, tacObj){
$('#tache').append('<option value="'+tacObj.id+'">'+catObj.libelle_tache+'</option>');
});
});
});
</script>
#endsection
route.php
Route::get('/tarification', 'TarificationController#index');
Route::get('/tarification/create', 'TarificationController#create');
Route::post('/tarification', 'TarificationController#store');
Route::get('/tarification/{id}/edit', 'TarificationController#edit');
Route::put('/tarification/{id}', 'TarificationController#update');
Route::delete('/tarification/{id}', 'TarificationController#destroy');
Route::get('/ajax-metier',function(){
$met_id = Input::get('met_id');
$taches = tache::where('metier_id','=', $met_id)->get();
return Response::json($metiers);
});
controller
public function create()
{
$techniciens = technicien::orderBy('id','desc')->get();
$taches = Tache::orderBy('libelle_tache', 'asc')->get();
$metiers = Metier::all();
return view('tarification.create')->with('taches', $taches)->with('techniciens', $techniciens)->with('metiers', $metiers);
}
/**
* Store a newly created resource in storage.
*
* #param \Illuminate\Http\Request $request
* #return \Illuminate\Http\Response
*/
public function store(Request $request)
{
$tarification = new tarificationtache();
$tarification ->tache_id = $request->input('tache_id');
$tarification ->Tarif =$request->input('Tarif');
$tarification->save();
$tarification->techniciens()->attach($request->technicien_id);
return redirect('home');
}