Level 102
Try using the @json helper
var projectTasks = @json($projectTaskJson);
1 like
Sep 15, 2021
3
Level 9
JSON return in console Uncaught SyntaxError: Unexpected token '&'
This is my controller where I want to show data in the format of calendar
public function show($id)
{
$project = Tbl_projects::query()->findOrFail($id);
$projectTaskJson = Todo::query()
->whereHas('user', function ($query) {
$query->where('user_id', auth()->user()->id);
})
->where('project_id',$project->project_id)
->get(['id', 'title', 'started_at as start', 'due_time as end'])
->toJson(JSON_PRETTY_PRINT);
return view('auth.projects.show', compact('project','projectTaskJson'));
}
view file
@push('scripts')
<script>
$(function () {
eventCalendar();
});
function eventCalendar() {
var projectTasks = {{ $projectTaskJson }};
console.log($projectTasks);
}
</script>
@endpush
In console it return me to the error like this
# Uncaught SyntaxError: Unexpected token '&'
# and data in the format of like this
var projectTasks = [
{
"id": 6,
"title": "Task for project one",
"start": "2021-08-19 15:00:00",
"end": "2021-08-20 15:20:00"
},
{
"id": 7,
"title": "Task by neeraj",
"start": "2021-08-19 16:00:00",
"end": "2021-08-20 16:18:00"
},
];
Level 55
@neeraj1005 or try to output unescaped data
var projectTasks = {!! $projectTaskJson !!};
1 like
Level 9
@silencebringer @sinnbeck problem resolved.
THe problem was in controller: I removed the toJson part and it return correct json
$projectTaskJson = Todo::query()
->whereHas('user', function ($query) {
$query->where('user_id', auth()->user()->id);
})
->where('project_id',$project->project_id)
->get(['id', 'title', 'started_at as start', 'due_time as end']);
In view blade @json($data) ,{{$data}}, and {!!$data!!} working
Here is my complete solution
Controller
public function show($id)
{
$project = Tbl_projects::query()
->isActive()
->findOrFail($id);
$projectTaskJson = Todo::query()
->whereHas('user', function ($query) {
$query->where('user_id', auth()->user()->id);
})
->where('project_id',$project->project_id)
->get(['id', 'title', 'started_at as start', 'due_time as end']);
$this->authorize('view', $project);
return view('auth.projects.show', compact('project','projectTaskJson'));
}
view
<script>
$(function () {
eventCalendar();
});
function eventCalendar() {
var projectTasks = @json($projectTaskJson);
var date = new Date();
var d = date.getDate();
var m = date.getMonth();
var y = date.getFullYear();
$('#calendarDiv').fullCalendar({
header: {
left: 'prev,next today',
center: 'title',
right: 'month,agendaWeek,agendaDay'
},
buttonText: {
today: 'today',
month: 'month',
week: 'week',
day: 'day'
},
events: projectTasks,
selectable: false,
selectHelper: true,
eventLimit: 3,
editable: false,
droppable: false,
});
}
</script>
Please or to participate in this conversation.