How do I properly display checkbox values on Laravel edit blade? - php

Question

Facing an annoying issue with checkboxes in a form I have created in Laravel.
I have assigned a value to each checkbox and when submitting to the database implode all the values together into an array.
The data will submit successfully to the database, but when I try to edit a submission, only the text based data shows up while the checkboxes will not re-populate.
Click here to see a preview of the issue.
I have tried a ton of this from StackoverFlow to to avail so wondering if anyone has an idea?
Happy to share code sample below
Complete Edit Blade
<x-app-layout>
<x-slot name="header">
<h2 class="font-semibold text-xl text-gray-800 leading-tight"> Edit Assessment </h2>
</x-slot>
<div>
<div class="max-w-4xl mx-auto py-10 sm:px-6 lg:px-8">
<div class="mt-5 md:mt-0 md:col-span-2">
<form method="post" action="{{ route('assessments.update', $assessment->id) }}"> #csrf #method('PUT') <div class="shadow overflow-hidden sm:rounded-md">
<div class="px-4 py-5 bg-white sm:p-6">
<label for="learner" class="block font-medium text-sm text-gray-700">Learner</label>
<input type="text" name="learner" id="learner" type="text" class="form-input rounded-md shadow-sm mt-1 block w-full" value="{{ old('learner', $assessment->learner) }}" /> #error('learner') <p class="text-sm text-red-600">{{ $message }}</p> #enderror
</div>
<div class="px-4 py-5 bg-white sm:p-6">
<label for="type" class="block font-medium text-sm text-gray-700">Type</label>
<input type="text" name="type" id="type" type="text" class="form-input rounded-md shadow-sm mt-1 block w-full" value="{{ old('type', $assessment->type) }}" /> #error('type') <p class="text-sm text-red-600">{{ $message }}</p> #enderror
</div>
<div class="px-4 py-5 bg-white sm:p-6">
<label for="assessor" class="block font-medium text-sm text-gray-700">Assessor</label>
<input type="text" name="assessor" id="assessor" type="text" class="form-input rounded-md shadow-sm mt-1 block w-full" value="{{ old('assessor', $assessment->assessor) }}" /> #error('assessor') <p class="text-sm text-red-600">{{ $message }}</p> #enderror
</div>
<div class="px-4 py-5 bg-white sm:p-6">
<label for="inquiry" class="block font-medium text-sm text-gray-700">Inquiry</label>
<input type="text" name="inquiry" id="inquiry" type="text" class="form-input rounded-md shadow-sm mt-1 block w-full" value="{{ old('inquiry', $assessment->inquiry) }}" /> #error('inquiry') <p class="text-sm text-red-600">{{ $message }}</p> #enderror
</div>
<div class="px-4 py-5 bg-white sm:p-6">
<label for="competency" class="block font-medium text-sm text-gray-700">Competency</label>
<input type="text" name="competency" id="competency" type="text" class="form-input rounded-md shadow-sm mt-1 block w-full" value="{{ old('competency', $assessment->competency) }}" /> #error('competency') <p class="text-sm text-red-600">{{ $message }}</p> #enderror
</div>
<div class="px-4 py-5 bg-white sm:p-6">
<label for="contexts" class="block font-medium text-sm text-gray-700">Contexts</label>
<input type="text" name="contexts" id="contexts" type="text" class="form-input rounded-md shadow-sm mt-1 block w-full" value="{{ old('contexts', $assessment->contexts) }}" /> #error('contexts') <p class="text-sm text-red-600">{{ $message }}</p> #enderror
</div>
<div class="px-4 py-5 bg-white sm:p-6">
<label for="artifact" class="block font-medium text-sm text-gray-700">Artifact</label>
<input type="text" name="artifact" id="artifact" type="text" class="form-input rounded-md shadow-sm mt-1 block w-full" value="{{ old('artifact', $assessment->artifact) }}" /> #error('artifact') <p class="text-sm text-red-600">{{ $message }}</p> #enderror
</div>
<div class="px-4 py-5 bg-white sm:p-6">
<label for="link" class="block font-medium text-sm text-gray-700">Link</label>
<input type="text" name="link" id="link" type="text" class="form-input rounded-md shadow-sm mt-1 block w-full" value="{{ old('link', $assessment->link) }}" /> #error('link') <p class="text-sm text-red-600">{{ $message }}</p> #enderror
</div>
<div class="px-4 py-5 bg-white sm:p-6">
<label for="notes" class="block font-medium text-sm text-gray-700">Notes</label>
<input type="text" name="notes" id="notes" type="text" class="form-input rounded-md shadow-sm mt-1 block w-full" value="{{ old('notes', $assessment->notes) }}" /> #error('notes') <p class="text-sm text-red-600">{{ $message }}</p> #enderror
</div>
<div class="px-4 py-5 bg-white sm:p-6">
<x-jet-label for="rating"> Rating <div class="flex items-center form-check-inline justify-center">
<div class="ml-2"></div>
<x-jet-checkbox name="rating[]" id="1" value="1" />
<div class="ml-2"></div>
<x-jet-checkbox name="rating[]" id="2" value="2" />
<div class="ml-2"></div>
<x-jet-checkbox name="rating[]" id="3" value="3" />
<div class="ml-2"></div>
<x-jet-checkbox name="rating[]" id="4" value="4" />
<div class="ml-2"></div>
<x-jet-checkbox name="rating[]" id="5" value="5" />
<div class="ml-2"></div>
<x-jet-checkbox name="rating[]" id="6" value="6" />
<div class="ml-2"></div>
<x-jet-checkbox name="rating[]" id="7" value="7" />
<div class="ml-2"></div>
<x-jet-checkbox name="rating[]" id="8" value="8" />
<div class="ml-2"></div>
</div>
</x-jet-label> #error('rating') <div class="items-center justify-center">
<p class="text-justify text-sm text-red-600">{{ $message }}</p>
</div> #enderror
</div> #error('rating') <p class="text-sm text-red-600">{{ $message }}</p> #enderror
</div>
<div class="flex items-center justify-end px-4 py-3 bg-gray-50 text-right sm:px-6">
<button class="inline-flex items-center px-4 py-2 bg-gray-800 border border-transparent rounded-md font-semibold text-xs text-white uppercase tracking-widest hover:bg-gray-700 active:bg-gray-900 focus:outline-none focus:border-gray-900 focus:shadow-outline-gray disabled:opacity-25 transition ease-in-out duration-150"> Edit </button>
</div>
</div>
</form>
</div>
</div>
</div>undefined
</x-app-layout>
Assessments Controller:
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use App\Http\Requests\StoreAssessmentRequest;
use App\Http\Requests\UpdateAssessmentRequest;
use App\Models\Assessment;
class AssessmentsController extends Controller
{
/**
* Display a listing of the resource.
*
* #return \Illuminate\Http\Response
*/
public function index()
{
$assessment = Assessment::all();
return view('assessments.index', compact('assessment'));
}
/**
* Show the form for creating a new resource.
*
* #return \Illuminate\Http\Response
*/
public function create()
{
return view('assessments.create');
}
/**
* Store a newly created resource in storage.
*
* #param \Illuminate\Http\Request $request
* #return \Illuminate\Http\Response
*/
public function store(StoreAssessmentRequest $request)
{
$data = $request->validated();
$data['rating'] = implode(", ",$data['rating']);
Assessment::create($data);
//Assessment::create($request->validated());
return redirect()->route('assessments.index');
}
/**
* Display the specified resource.
*
* #param int $id
* #return \Illuminate\Http\Response
*/
public function show(Assessment $assessment)
{
return view('assessments.show', compact('assessment'));
}
/**
* Show the form for editing the specified resource.
*
* #param int $id
* #return \Illuminate\Http\Response
*/
public function edit(Assessment $assessment)
{
return view('assessments.edit', compact('assessment'));
}
/**
* Update the specified resource in storage.
*
* #param \Illuminate\Http\Request $request
* #param int $id
* #return \Illuminate\Http\Response
*/
public function update(UpdateAssessmentRequest $request, Assessment $assessment)
{
$data = $request->validated();
$data['rating'] = implode(", ",$data['rating']);
$assessment->update($data);
return redirect()->route('assessments.index');
}
/**
* Remove the specified resource from storage.
*
* #param int $id
* #return \Illuminate\Http\Response
*/
public function destroy(Assessment $assessment)
{
$assessment->delete();
return redirect()->route('assessments.index');
}
}
UpdateAssessmentRequest
<?php
namespace App\Http\Requests;
use Illuminate\Foundation\Http\FormRequest;
class UpdateAssessmentRequest extends FormRequest
{
/**
* Determine if the user is authorized to make this request.
*
* #return bool
*/
public function authorize()
{
return true;
}
/**
* Get the validation rules that apply to the request.
*
* #return array
*/
public function rules()
{
return [
'type' => 'required',
'learner' => 'required',
'assessor' => 'required',
'competency' => 'required',
'contexts' => 'required',
'artifact' => 'required',
'inquiry' => 'required',
'link' => 'required',
'notes' => 'required',
'rating' => 'required',
];
}
}