I have the form below, with 4 comboboxes "Metier" "tache" "tacrification" et "technicien", i select a Metier and a tache, after this i want that a popup box appears and show me a table that contains all the "techniciens" and their "tarification" (of course only the "techniciens" that are related with the "tache" already selected.) after this i select a "technicien" from that table a now the form is completely filled with the "technicien" and it's "tarification". Could anyone help me with this please?
iterventioncontroller
public function create()
{
$client = client::orderBy('id', 'asc')->get();
$metiers = metier::orderBy('id', 'asc')->get();
$technicien = Technicien::orderBy('id', 'desc')->get();
$tarifications = tarificationtache::orderBy('id', 'desc')->get();
return view('intervention.create')->with('technicien', $technicien)-
>with('client',$client)-
>with('metiers',$metiers)->with('tarifications',$tarifications);
}
/**
* Store a newly created resource in storage.
*
* @param \Illuminate\Http\Request $request
* @return \Illuminate\Http\Response
*/
public function store(InterventionRequest $request)
{
$intervention = new Intervention();
$intervention ->date_intervention =$request-
>input('date_intervention');
$intervention ->description =$request->input('description');
$intervention ->duree_prevu =$request->input('duree_prevu');
if($request->has('statut')){
$intervention->statut = $request->input('statut');
}else{
$intervention->statut = 0;
}
$intervention ->technicien_id = $request->input('technicien_id');
$intervention ->client_id = $request->input('client_id');
$intervention ->tarification_id = $request->tarification_id;
$intervention->save();
return redirect('intervention');
}
create.blade.php
@extends('Layouts/app')
@extends('Layouts/master')
@section('content')
<!-- jQuery -->
<script
src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script type="text/javascript">
var getTachesByMetierUrl = "";
var getAdresseByClientUrl = "";
var getTarificationsByTacheUrl = "";
var getTechniciensByTarificationtacheUrl = "
";
//console.log(getMetiersByTechnicienUrl,getTachesByMetierUrl,getTarificationsByTacheUrl);
function getAdresseByClient(val) {
if(val.length>0) {
var client_id = val;
$.get(getAdresseByClientUrl+'/'+client_id,function(res) {
var html = '<option value="">-Select-</option>' ;
$.each(res.adresses,function(index,item) {
html+='<option
value="'+item.id+'">'+item.code_postal+'</option>';
});
$('#adresses').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);
});
}
}
function getTarificationsByTache(val) {
if(val.length>0) {
var tache_id = val;
$.get(getTarificationsByTacheUrl+'/'+tache_id,function(res) {
var html = '<option value="">-Select-</option>' ;
$.each(res.tarifications,function(index,item) {
html+='<option
value="'+item.id+'">'+item.tarif+'</option>';
});
$('#tarifications').html(html);
});
}
}
function getTechniciensByTarificationtache(val) {
if(val.length>0) {
var tarificationtache_id = val;
$.get(getTechniciensByTarificationtacheUrl+'/'+tarificationtache_id,function(res) {
var html = '<option value="">-Select-</option>' ;
$.each(res.techniciens,function(index,item) {
html+='<option value="'+item.id+'">'+item.id+'</option>';
});
$('#techniciens').html(html);
});
}
}
@if(count($errors))
<div class="alert alert-danger" role="alert">
<ul>
@foreach($errors ->all() as $message)
<li></li>
@endforeach
</ul>
</div>
@endif
<div class="container">
<div class="row"></div>
<div class="col-md-10">
<h1>Ajout Intervention</h1>
<form action=" " method="post">
<div class="form-group">
<label for="client">Client</label>
<select onchange="getAdresseByClient(this.value)"
name="client_id" id="client"
class="form-control">
<option value="">-Select-</option>
@foreach($client as $t)
<option value="">
</option>
@endforeach
</select>
</div>
<div class="form-group">
<label for="">date intervention</label>
<input class="form-control" type="date" id="example-date-
input" name
="date_intervention" value="">
</div>
<div class="form-group">
<label for="">description</label>
<input type="text" name ="description" class="form-
control"value="
">
</div>
<div class="form-group">
<label for="">duree_prevu</label>
<input class="form-control" type="datetime-local" name
="duree_prevu" value="
">
</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>
@foreach($metiers as $t)
<option value="">
</option>
@endforeach
</select>
</div>
<div class="col-md-4">
<label>tache: </label>
<select onchange="getTarificationsByTache(this.value)"
style="width: 200px"
class="productname form-control" name="tache" id="taches">
<option value="">-Select-</option>
</select>
</div>
<div class="col-md-4">
<label>tarification: </label>
<select
onchange="getTechniciensByTarificationtache(this.value)"
style="width:
200px" class="productname form-control" name="tarificationtache_id"
id="tarifications">
<option value="">-Select-</option>
</select>
</div>
<div class="col-md-4">
<label>technicien: </label>
<select style="width: 200px" class="productname
form-control"
name="technicien_id" id="techniciens">
<option value="">-Select-</option>
</select>
</div>
</div>
</div>
</div>
</div>
</div>
<link
href="https://ift.tt/1jAc5cP" rel="stylesheet">
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-
datepicker/1.5.0/css/bootstrap-
datepicker.css" rel="stylesheet">
<script
src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.js">
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-
datepicker/1.5.0/js/bootstrap-
datepicker.js"></script>
@endsection
via
Chebli Mohamed
