如何在下拉列表中显示特定类别 ID 的子类别。在 Laravel 中

时间:2021-01-28 00:52:54

标签: php laravel post foreach dropdownbox

所以在弄清楚如何在下拉列表中显示类别和子类别之后。我一直在试图弄清楚是否可以显示类别类的特定子类别。

这些是我设置的类别Categories 在创建了我创建的子类别之后,此处显示的类别基于第一个猫 ID - selectionsSubCategories

cat 和 subcat 创建如下;

AppServiceProvider.php

<?php

namespace App\Providers;

use App\Category;
use Illuminate\Support\Facades\View;
use Illuminate\Support\ServiceProvider;

class AppServiceProvider extends ServiceProvider
{
    /**
     * Register any application services.
     *
     * @return void
     */
    public function register()
    {
        //
    }

    /**
     * Bootstrap any application services.
     *
     * @return void
     */
    public function boot()
    {
        View::share('categories', Category::orderBy('name')->get());
    }
}

Web.php

<?php

use App\Http\Controllers\CategoryController;
use App\Http\Controllers\SubcategoryController;
use Illuminate\Support\Facades\Auth;
use Illuminate\Support\Facades\Route;

/*
|--------------------------------------------------------------------------
| Web Routes
|--------------------------------------------------------------------------
|
| Here is where you can register web routes for your application. These
| routes are loaded by the RouteServiceProvider within a group which
| contains the "web" middleware group. Now create something great!
|
*/

//Route::get('/Home', function () {
//    return view('welcome');
//});

Auth::routes();

Route::get('/email', function () {
   return new \App\Mail\NewUserWelcomeMail();
});

Route::post('follow/{user}', 'FollowsController@store');

Route::get('dashboard/profile', 'ProfilesController@show');

Route::get('/search','SearchController@search');

Route::get('/home', 'HomeController@index');

Route::get('/categories', 'CategoryController@index');

Route::get('/', 'PostsController@index');
Route::get('/p/create', 'PostsController@create');
Route::post('/p', 'PostsController@store');
Route::get('/p/{post}', 'PostsController@show');

//Route::prefix('/recipes')->group(function () {
//    Route::get('/create-step1', 'RecipesController@createStep1');
//    Route::get('/create-step2', 'RecipesController@createStep2');
//    Route::get('/create-step3', 'RecipesController@createStep3');
//    Route::get('/create-step4', 'RecipesController@createStep4');
//    Route::post('/create-step1', 'RecipesController@postCreateStep1');
//    Route::post('/create-step2', 'RecipesController@postCreateStep2');
//    Route::post('/create-step3', 'RecipesController@postCreateStep3');
//    Route::post('/create-step4', 'RecipesController@postCreateStep4');
//    Route::post('/remove-image', 'RecipesController@removeImage');
//});

Route::get('/recipes/create', 'RecipesController@create');
Route::get('subcategories/get/{id}', 'RecipesController@getStates');


Route::get('/profile/{user}', 'ProfilesController@index')->name('profile.show');
Route::get('/profile/{user}/edit', 'ProfilesController@edit')->name('profile.edit');
Route::patch('/profile/{user}', 'ProfilesController@update')->name('profile.update');

类别.php

  <?php
    
    namespace App;
    
    use Illuminate\Database\Eloquent\Model;

class Category extends Model

{
    protected $fillable = [];


    public function subcategories(){
        return $this->hasMany('App\Subcategory');
    }

    public function posts(){
        return $this->hasMany('App\Post');
    }

}

?>

RecipesController.php

<?php

namespace App\Http\Controllers;

use App\Recipe;
use Illuminate\Http\Request;
use Illuminate\Http\Response;
use Illuminate\Contracts\Foundation\Application;
use Illuminate\Contracts\View\Factory;
use Illuminate\Support\Facades\DB;
use Illuminate\View\View;

class RecipesController extends Controller
{
    public function index()
    {

        return view('recipes.index');
    }

    public function create()
    {

        $categories = DB::table('categories')->pluck("name","id");
        return view ('recipes.create', compact($categories));
    }

    public function getStates($id)
    {

        $subcategories = DB::table("subcategories")->where("category_id", $id)->pluck("name", "id");

        return json_encode($subcategories);
    }

}

食谱/create.blade.php

@extends('layouts.app')
@section('content')
    <!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Multi Step Form | Recipes smartMeals</title>
</head>
<body>

<div class="container">
    <header>Create Your First Recipe</header>

    <div class="form-outer">
        <form action="#">

            <div class="page">
                <div class="title">What's your recipe:</div>

                <div class="field pt-1">

                    <div class="label pt-3">Title</div>
                    <input type="text" placeholder="Name the recipe">
                </div>

                <div class="field">
                    <label class="label pt-3">Description</label>
                    <div class="control pb-1">
                        <textarea class="textarea" placeholder="Lets cut to the cheese"></textarea>
                    </div>

                    <div class="field">
                        <button>Next</button>
                    </div>
                </div>
            </div>

            <div class="page">

                <div class="title pt-3">Recipe information:</div>

                <div class="field is-horizontal pt-3">
                    <div class="field-label is-normal">
                        <label class="label">Selections</label>
                    </div>

                    <div class="field-body">
                        <div class="field is-narrow">
                            <div class="control">
                                <div class="select is-fullwidth">
                                    <select>
                                        <option value="">--Select Selections--</option>
                                        @foreach($categories as $category)
                                        <option>{{$category -> name}}</option>
                                        @endforeach
                                    </select>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="field is-horizontal pt-3">
                    <div class="field-label is-normal">
                        <label class="label">Selections type</label>
                    </div>

                <div class="field-body">
                    <div class="field is-narrow">
                        <div class="control">
                            <div class="select is-fullwidth">
                                <select name="subcatagories">
                                    <option>--Select Selection Type--</option>
                                </select>
                            </div> <div class="col-md-2"><span id="loader"><i class="fa fa-spinner fa-3x fa-spin"></i></span></div>

                        </div>
                        </div>
                    </div>
                </div>


    <div class="field pt-2">
                    <label class="label">Message</label>
                    <div class="control">
                        <textarea class="textarea" placeholder="Lets cut to the cheese"></textarea>
                    </div>

                    <div class="field">
                        <button>Next</button>
                    </div>
                </div>
            </div>


        </form>
    </div>
</div>

<script src="{{ asset('js/app.js') }}"></script>
<script src="{{ asset('js/custom.js') }}"></script>

</body>
</html>

@endsection

custom.js

$(document).ready(function() {

    $('select[name="categories"]').on('change', function(){
        var categoryId = $(this).val();
        if(categoryId) {
            $.ajax({
                url: '/subcategory/get/'+categoryId,
                type:"GET",
                dataType:"json",
                beforeSend: function(){
                    $('#loader').css("visibility", "visible");
                },

                success:function(data) {

                    $('select[name="subcategory"]').empty();

                    $.each(data, function(key, value){

                        $('select[name="subcategory"]').append('<option value="'+ key +'">' + value + '</option>');

                    });
                },
                complete: function(){
                    $('#loader').css("visibility", "hidden");
                }
            });
        } else {
            $('select[name="subcategory"]').empty();
        }

    });

});

我希望更改 recipes/create.blade.php 中的代码部分;

<div class="field-body">
                        <div class="field is-narrow">
                            <div class="control">
                                <div class="select is-fullwidth">
                                    <select>
                                        <option value="">--Select Selections--</option>
                                        @foreach($categories as $category)
                                        <option>{{$category -> name}}</option>
                                        @endforeach
                                    </select>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

要显示类别 id{1} 的子类别,这可以吗?

0 个答案:

没有答案