没有选择类别不显示子类别 [英] without select category not show subcategory

问题描述

这是create.blade.php文件.其中也包括css和js文件. HTML代码和Ajax代码查看文件

This is create.blade.php file. In this include css and js file too.. Html code and ajax code view file

@extends('layouts.app')

@section('content')
 <link rel="stylesheet" href="http://www.codermen.com/css/bootstrap.min.css">    
 <script src="http://www.codermen.com/js/jquery.js"></script>
<form enctype="multipart/form-data" method="post" action="{{route('post.store')}}" >
       @csrf
       <div class="form-group col-md-8">
                    Category<select name="category" id="category" class="form-control">
                                    <option>select</option>
                        @foreach($categories as $category)
                <option value="{{$category->id}}">{{$category->category}}</option>
                @endforeach
                            </select>
       </div>
       <div class="form-group col-md-8">
                    Category<select name="subcategory" id="subcategory" class="form-control">
                                    <option>select</option>
                        @foreach($subcategories as $subcategory)
                <option value="{{$subcategory->id}}">{{$subcategory->subcategory}}</option>
                @endforeach
                            </select>
       </div>
</form>

@endsection


 

这是控制器代码，可创建类别和子类别的功能代码

This is controller code which create function code of category and subcategory

public function create(Request $request){
    $categories = Category::all();
    $subcategories = DB::table('subcategories')
                        ->where('category_id', $request->category_id)
                        ->pluck('subcategory', 'id');
  return view('post.create', compact('categories', 'subcategories'));
}

这是路线

Route::get('/post/create', 'PostController@create')->name('post.create');

问题是如果我选择类别仍然没有与该子类别相关的节目

Problem is if i select category still no show related to subcategory

推荐答案

您犯了一个愚蠢的错误，您正在向创建函数发送类别更改下拉列表的ajax请求，而您的创建函数正在渲染视图post.create.返回对ajax请求的json响应.

you have done silly mistake , you are sending ajax request on change of category select dropdown to your create function , while your create function is rendering view post.create instead of return json response to ajax request .

那么现在您能做什么?您可以使用2个选项:

so now what you can do ? 2 options available to you :

选项1:创建另一个名为"get_subcategory_by_category_id"的函数，该函数将返回json中的子类别，也将在route/web.php中为其创建新路由.

option 1 : create other function named "get_subcategory_by_category_id" and that will return subcategories in json , also create new route in routes/web.php for same .

选项2:laravel提供$request->ajax()来检测请求是否为ajax?因此，使用它并在json中返回响应，这样您将获得响应.

option 2 : laravel provide $request->ajax() to detect that request is ajax or not ? so use that and return response in json , so you will get response .

public function create(Request $request){
    $categories = Category::all();
    $subcategories = DB::table('subcategories')
                        ->where('category_id', $request->category_id)
                        ->pluck('subcategory', 'id');

    if($request->ajax()){
        $response=array('categories'=>$categories,'subcategories'=>$subcategories);
        return response()->json($response,200);
    }
    return view('post.create', compact('categories', 'subcategories'));
}

您的ajax函数应如下所示:

your ajax function should be like below :

<script type="text/javascript">
    $(document).on('change','#category',function(){
    var categoryID = $(this).val();    
    if(categoryID){
        $.ajax({
           type:"GET",
           url:"{{url('create')}}?category_id="+categoryID,
           dataType:'json',
           success:function(res){               
            if(res){
                console.log(res);
                // forloop through subcategory and append 
            }else{
               $("#subcategory").empty();
            }
           }
        });
    }else{
        $("#subcategory").empty();

    }      
   });
</script>

确保您的请求网址正确，还检查检查元素">网络"选项卡以获取ajax请求响应.

make sure that your request url is proper , also check Inspect Element > Network tab for ajax request response .

这篇关于没有选择类别不显示子类别的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！