Question

在下面的表格中，我有两个下拉列表，第一个选择“metier”，第二个选择“tache”。当我选择“metier”时，我希望第二个下拉列表“tache”仅显示与已选择的“Metier”相关的选项。

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">

 <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);
});

控制器

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');
}

Answer 1

使用catObj.libelle_tache

替换tacObj.libelle_tache

在route.php中将return Response::json($metiers);替换为return Response::json($taches );

在控制器create()功能->with('taches', $taches)到->with('taches', [])

并将$.get('/ajax-tac?修改为$.get('/ajax-metier?

Good example

如何制作下拉列表仅显示与所选值相关的选项？

1 个答案: