Question

我有三个表..我想获取与某个地点相关的类别..因此，当我选择一个地点时，它会过滤类别并向我显示该地点的类别列表。设置了多对多关系。

-----     -------------    ------------
place     category_place      category
------    --------------   ------------
id         place_id          id
name        category_id       name
-------------------------------------

放置模型：

   public function categories()
    {
        return $this->belongsToMany('App\Category','category_places','place_id','category_id');
    }

在我的物品控制器中

     public function create()
    {
        $activeMenu = 'placetypes';
        $placetype = new PlaceType();
        return view('Admin.placeTypes.create',['placetype'=>$placetype,'activeMenu'=>$activeMenu]);
    }

    /**
     * Store a newly created resource in storage.
     *
     * @param  \Illuminate\Http\Request  $request
     * @return \Illuminate\Http\Response
     */
    public function store(PlaceTypeFormRequest $request)
    {
//        PlaceType::create([
//            'name'=>$request->input('name'),
//            'icon'=>$request->input('icon'),
//            'status'=>$request->input('status'),
//        ]);
        if($request->hasFile('image_name'))
        {
            $filenameWithExt = $request->file('image_name')->getClientOriginalName();
            $filename = pathinfo($filenameWithExt,PATHINFO_FILENAME);
            $extension = $request->file('image_name')->getClientOriginalExtension();
            $fileNameToStore = $filename.'_'.time().'.'.$extension;
            $path = $request->file('image_name')->storeAs('public/photos',$fileNameToStore);
        }else
        {
            $fileNameToStore = 'No-Image-Available.png';
        }
        $pt = new PlaceType();
        $pt->name = $request->input('name');
        $pt->status = $request->input('status');
        $pt->icon = $fileNameToStore;
        $pt->save();

        return redirect('/placeTypes')->with('succes','تمت إضافة قسم المحل بنجاح');
    }

在Ruoutes web.php中

Route::resource('places','Admin\PlaceController');

... 在我的create.blade.php视图中

   <div class="form-group" >
                <label class="text-primary" dir="rtl" for="exampleFormControlSelect1">{{trans('admin.theplace')}}</label>
                <select class="form-control" name="place" data-style="btn btn-link" id="exampleFormControlSelect1">
                    @foreach($places as $pt)
                    <option value="{{$pt->id}}" {{ ($pt->name)? "selected" : '' }}  >{{$pt->name}}</option>
                    @endforeach
                </select>
            </div>
            <div class="form-group" >
                <label class="text-primary" dir="rtl" for="exampleFormControlSelect1">{{trans('admin.itemCats')}}</label>
                <select class="form-control" name="itemcat" id="category" data-style="btn btn-link" id="exampleFormControlSelect1">
                    @foreach($categories as $cat)
                    <option value="{{ $cat->id }}" {{ (isset($cat->name))? "selected" : '' }}  >{{$cat->name}}</option>
                    @endforeach
                </select>
            </div>

jQuery代码：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script>
        function dropdown(msg){
            var place=msg;
            $.ajax({
                url: 'getcategory/'+place,
                type: 'get',
                dataType: 'json',
                success: function(response){
                    $("#category").empty();

                    var len = 0;
                    if(response['data'] != null){
                        len = response['data'].length;
                    }
                    if(len > 0){
                        // Read data and create <option >
                        for(var i=0; i<len; i++){

                            var id = response['data'][i].id;
                            var name = response['data'][i].name;

                            var option = "<option value='"+name+"'>"+name+"</option>";

                            $("#category").append(option);
                        }
                    }

                }
            });
        }
    </script>

Answer 1

使用onchange。尝试


<div class="form-group" >
                <label class="text-primary" dir="rtl" for="exampleFormControlSelect1">{{trans('admin.theplace')}}</label>
                <select class="form-control" name="place" data-style="btn btn-link" id="exampleFormControlSelect1">
                    @foreach($places as $pt)
                    <option value="{{$pt->id}}" {{ ($pt->name)? "selected" : '' }}  >{{$pt->name}} onchange="dropdown('{{$p->id}}')"</option>
                    @endforeach
                </select>
            </div>
            <div class="form-group" >
                <label class="text-primary" dir="rtl" for="exampleFormControlSelect1">{{trans('admin.itemCats')}}</label>
                <select class="form-control" name="itemcat" id="category" data-style="btn btn-link" id="exampleFormControlSelect1">
                    @foreach($categories as $cat)
                    <option value="{{ $cat->id }}" {{ (isset($cat->name))? "selected" : '' }}  >{{$cat->name}}</option>
                    @endforeach
                </select>
            </div>

Answer 2

我必须经常这样做，这也是我的工作方式
HTML /刀片

<select name="select_name" id="select1" class="form-control">
<option value="">choose</option
@foreach($models as $model)
<option value="{{ $model->id }}">{{ $model->attribute }}</option>
@endforeach
</select>

<select name="select_name" id="select2" class="form-control">
<option value="">choose select 1 first</option>
</select>

这是jQuery

$("#select1").change(function(e){
var model = e.target.value;
$.get("/api/your-route?input="+model, function(data){
  $("#select2").empty();
  $("#select2").append("<option value=''>choose</option>");

  $.each(data, function(index, obj){
  $("#select2").append("<option value='model.id'>model.attribute</option>");
});
});
});

Laravel

public function func_name(Request $request){
//if you work with Laravel 5.8 or older, you could you the input facade
$childern = Child::where('parent_id', $request->input('parent'))->get();

return response()->json($childern, 200);
// if you want to use a resource, that's even better
}

对于我来说，它总是很吸引人，并且每次父母更改时我都会从api获取值，因此我不必担心有人会使用检查员的值

Answer 3

与其向GET请求获取getcategory / {place}，而是尝试向getcategory发出请求，然后将场所ID作为边界传递。您还需要在位置下拉菜单上使用change方法。

jQuery

$('#exampleFormControlSelect1').change(function() {

 $.ajax({
  url: '/getcategory',
  type: 'GET',
  data: {id: $('#exampleFormControlSelect1').val()}
 }).done(function(response){
    //what you want to do with your response//
  });
});

控制器

public function getCategory(Request $request)
    {

        return Place::where('id', $request->id)->categories()->pivot->category_id->get();
    }

在这里，您的答复应该是您通过的地点的数据透视表中所有category_id的集合。

如何使下拉列表依赖于使用jQuery在laravel中的另一个下拉列表？

3 个答案: