I have a form to edit the administrators of a post.
This form has some radio buttons. Each radio button corresponds to a administrator of a a post. When some radio button (administrator) is clicked the details of the administrator are populated in the form fields. When the "Update" button is clicked the details of the administrator are updated.
This is working fine.
Doubt:
But there is a static radio button, "Create new administrator", that allows to create a new administrator. When this radio button is selected the form fields are reseted so the user can insert values to create a new admin.
My doubt is how we can reuse this same form for the udpate, that is already working fine, but also for the creation of a new administrator when the radio button selected is "Create new admin"? Or, what could be a proper approach for this context?
form:
<form method="post" class="clearfix" action="{{route('admins.update', ['id' => $post->id])}}" enctype="multipart/form-data">
{{csrf_field()}}
@foreach($administrators $admin)
<div class="form-check">
<input class="form-check-input" type="radio" name="radiobutton" id="{{$admin->id}}" value="">
<label class="form-check-label" for="">
{{$admin->name}}
</label>
</div>
@endforeach
<div class="form-check">
<input class="form-check-input" type="radio" name="radiobutton" id="create_administrator"
value="option2">
<label class="form-check-label" for="exampleRadios2">
Create new administrator
</label>
</div>
<div class="form-group">
<label for="name">Name</label>
<input type="text" required class="form-control" value="{{ $admin->name }}" name="name">
</div>
<!-- below I have more form fields like administrator name, email, etc -->
<input type="submit" id="adminStoreButton" class="btn btn-primary" value="Create"/>
<input type="submit" id="adminUpdateButton" class="btn btn-primary" value="Update"/>
</form>
JS: to show the details of the admin based on radio button selection and to hide and show the store/update button
var admins = {!! $administrators !!}
$("input[name='radiobutton']").click(function() {
if($(this).attr("id") == "create_administrator"){
$("#adminUpdateButton").hide();
$("#adminStoreButton").show();
form.attr('action', '{{route('admins.store', ['post_id' => $post->id])}}');
}
else{
$("#adminUpdateButton").show();
$("#adminStoreButton").hide();
form.attr('action', '{{route('admins.update', ['post_id' => $post->id])}}');
}
let id = $(this).attr("id");
let data = administrators.find(e => e.id == id) || {
name: "",
email: "",
...: ""
};
$("input[name='name']").val(data.name);
...
});
// update admins routes
Route::get('post/edit/{id}/admins', [ 'uses' => 'AdminController@edit', 'as'=>'admins.edit']);
Route::post('post/update/{id}/admins', [ 'uses' => 'AdminController@update', 'as'=>'admins.update']);
Administrator controller update method:
public function update(Request $request, $id){
$this->validate($request, [
'name' => 'required|string',
...
]);
$adminToUpdate = Administrator::find($request->radiobutton);
$adminToUpdate->name = $request->name;
...
$adminToUpdate->save();
return redirect()->back();
}
}
Administrator controller edit method:
public function edit($id)
{
$post = Post::find($id);
$administrators = Administrator::where('post_id', $id)->get();
return view('administrators.edit')
->with('post', $post)
->with('administrators', $administrators));
}