Laravel multi select options ajax request - laravel

Question

I'm trying to add multiple courses for a user using ajax. When I click on submit button, everything else updated but the courses. I don't know what I did wrong. Please help me...
This is my blade:
<input type="hidden" name="user_id" id="user_id" value="{{$user_details->id}}">
#csrf
<div class="form-group">
<label for="name">Name</label>
<input type="text" class="form-control" id="name" name="name" value="{{$user_details->name}}">
</div>
<div class="form-group">
<label for="email">Email</label>
<input type="text" class="form-control" id="email" name="email" value="{{$user_details->email}}">
</div>
<div class="form-group">
<label for="courses_id">Courses</label>
#php
$all_courses = $user_details->courses_id;
#endphp
<select name="courses_id[]" multiple id="course" class="form-control nice-select wide">
#foreach($courses as $data)
#if($all_courses)
<option #if(in_array($data->id,$all_courses)) selected #endif value="{{$data->id}}">{{$data->title}}</option>
#else
<option value="{{$data->id}}">{{$data->title}}</option>
#endif
#endforeach
</select>
</div>
<button type="submit" class="btn btn-primary mt-4 pr-4 pl-4">{{__('Update User')}}</button>
</form>
<script>
$(document).ready(function() {
if($('.nice-select').length > 0){
$('.nice-select').niceSelect();
}
$(document).on('change','select[name="courses_id[]"]',function (e) {
e.preventDefault();
var selectedId = $(this).val();
$.ajax({
url : "{{route('admin.user.course.by.slug')}}",
type: "POST",
data: {
_token : "{{csrf_token()}}",
id: selectedId
},
success:function (data) {
$('#course').html('');
$.each(data,function (index,value) {
$('#course').append('<option '+selected+' value="'+value.id+'">'+value.title+'</option>');
$('.nice-select').niceSelect('update');
});
}
});
});
} );
</script>
My controller:
namespace App\Http\Controllers;
use App\Courses;
use App\User;
use Illuminate\Http\Request;
use Illuminate\Support\Facades\Hash;
class UserController extends Controller
{
public function edit($id)
{
$user_details = User::find($id);
$courses = Courses::where(['status'=> 'publish'])->get();
return view('backend.user.edit-user')->with([ 'user_details' => $user_details, 'courses' => $courses]);
}
public function user_update(Request $request)
{
$this->validate($request, [
'name' => 'required|string|max:191',
'email' => 'required|string|max:191',
'courses_id' => 'nullable',
],[
'name.required' => __('Name is required'),
'email.required' => __('Email is required'),
]);
User::find($request->user_id)->update([
'name' => $request->name,
'email' => $request->email,
'courses_id' => serialize($request->courses_id),
]);
return redirect()->back()->with(['msg' => __('User Profile Updated Successfully..'), 'type' => 'success']);
}
public function course_by_slug(Request $request){
$all_courses = Courses::where(['status' => 'publish'])->get();
return response()->json($all_courses);
}
}
My route:
Route::prefix(user')->middleware(['adminPermissionCheck:Users Manage'])->group(function () {
Route::get('/edit/{id}', 'UserController#edit')->name('admin.user.edit');
Route::post('/update', 'UserController#user_update')->name('admin.user.update');
Route::post('/course-by-slug', 'UserController#course_by_slug')->name('admin.user.course.by.slug');
});