Пользовательское поле для цвета фона для каждой категории в category.blade (от панели администратора до просмотра) (laravel, контроллер)

Question

Привет, ребята, я хочу добавить определенный c фон для каждой категории, которую я добавил из моего category.blade в панели администратора

У меня есть 2 поля: включено для имени и второе для изображения

я хочу добавить третье поле (поле выбора), это поле для выбора цвета категории.

когда я выберу цвет из поля выбора, это будет фон в файле category.blade для каждой категории курса (мы можем использовать функцию, чтобы таким образом добавить Id = '$ color' для каждой категории ИМЯ ИМЕТЬ = ЦВЕТ)

-categories blade ( admin):

    {{ Form::open(['class' => 'form-horizontal', 'files' => true]) }}

    <div class="form-group {{ $errors->has('category_name')? 'has-error':'' }}">
        <label for="category_name" class="col-sm-4 control-label">@lang('app.category_name')</label>
        <div class="col-sm-8">
            <input type="text" class="form-control" id="category_name" value="{{ old('category_name') }}" name="category_name" placeholder="@lang('app.category_name')"> {!! $errors->has('category_name')? '
            <p class="help-block">'.$errors->first('category_name').'</p>':'' !!} </div></div>


    <div class="form-group {{ $errors->has('image')? 'has-error':'' }}">
        <label for="image" class="col-sm-4 control-label">@lang('app.image')</label>
        <div class="col-sm-8">
            <input type="file" name="image" id="image" class="form-control"> {!! $errors->has('image')? '
            <p class="help-block">'.$errors->first('image').'</p>':'' !!} </div></div>

• контроллер категории:

public function category($category_name){  return view('content.category' , compact('post'));
    }
    public function index(){
        $title = trans('app.categories');
        $categories = Category::all();

            return view('admin.categories', compact('title', 'categories'));
        }


        public function store(Request $request)
        {
            $rules = [
                'category_name' => 'required',
                'image'         => 'image'
            ];
            $this->validate($request, $rules);

            $slug = str_slug($request->category_name);
            $duplicate = Category::where('category_slug', $slug)->count();
            if ($duplicate > 0){
                return back()->with('error', trans('app.category_exists_in_db'));
            }

            /**
             * Upload image if any
             */
            $image_name = '';
            if ($request->hasFile('image')){
                $upload_dir = public_path('uploads/images/');
                if ( ! file_exists($upload_dir)){
                    mkdir($upload_dir, 0777, true);
                }

                $image = $request->file('image');
                $file_base_name = str_replace('.'.$image->getClientOriginalExtension(), '', $image->getClientOriginalName());
                $resized = Image::make($image)->resize(300, 200);

                $image_name = strtolower(time().str_random(5).'-'.str_slug($file_base_name)).'.' . $image->getClientOriginalExtension();
                $imageFileName = $upload_dir.$image_name;

                try{
                    $resized->save($imageFileName);
                } catch (\Exception $e){
                    return $e->getMessage();
                }
            }

            $data = [
                'category_name' => $request->category_name,
                'category_slug' => $slug,
                'image' => $image_name,
            ];

            Category::create($data);
            return back()->with('success', trans('app.category_created'));
        }

• вид блейд-категории:

    <a href="{{route('single_category', [$cat->id, $cat->category_slug])}}">
    <div  class="wow flipInY col-md-2 col-sm-6 col-xs-12 col-center">
    <div class="home-category-box">
    <img id="" src="{{ $cat->get_image_url() }}" />
    <div class="title">
    <a href="{{route('single_category', [$cat->id, $cat->category_slug])}}">{{ 
    $cat->category_name }}</a>

Answer 1

Сначала вам нужно будет добавить поле выбора в форму:

<div class="form-group {{ $errors->has('color')? 'has-error':'' }}">
    <label for="color" class="col-sm-4 control-label">@lang('app.color')</label>
    <div class="col-sm-8">
        <select name="color" id="color" class="form-control" onchange="setColor()">
            <option value="red">Red</option>
            <option value="green">Blue</option>
            <option value="blue">Blue</option>
        </select>
        {!! $errors->has('image')? '<p class="help-block">'.$errors->first('image').'</p>':'' !!}
    </div>
</div>

Затем добавьте немного JavaScript, чтобы изменить цвет фона поля выбора на выбранный цвет:

<script type="text/javascript">
function setColor() {
    document.getElementById("color").setAttribute("style", "background-color: " + document.getElementById("color").value);
}
</script>