Javascript не называется

Question

Возможно, я пропустил очень важный шаг, но я пытаюсь реализовать простой календарь, используя laravel. Мой JavaScript не называется. Я мог бы также убедиться, что в другой таблице данные, поступающие с контроллера, не пусты. уже дд это и проверил.

Ниже мой код. У меня нет ошибки в браузере. ничего в оповещении или console.log тоже нет. Я буду признателен за вашу помощь, чтобы запустить это.

@extends('layouts.app')

@section('content')

<h3 class="page-title">@lang('Test calendar Appointement')</h3>
<div id='calendar'></div>
@stop
@section('javascript')
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.17.1/moment.min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.1.0/fullcalendar.min.js'></script>
<script>
    $(document).ready(function() {
            // page is now ready, initialize the calendar...
            alert("here");
            console.log("here");
            $('#calendar').fullCalendar({
                // put your options and callbacks here
                defaultView: 'agendaWeek',
                events : [
                @foreach($appointments as $appointment)
                {
                    title : '{{ $appointment->user->first_name . ' ' . $appointment->user->last_name }}',
                    start : '{{ $appointment->start_time }}',
                    @if ($appointment->finish_time)
                    end: '{{ $appointment->finish_time }}',
                    @endif

                },
                @endforeach
                ]
            })
        });
    </script>
    @endsection

Answer 1

Ваш код javascript выглядит хорошо. Я подозреваю, что есть проблема с вами l oop в javacript. Я рекомендую вам сделать l oop в вашем контроллере и просто передать переменную в javacript. Также убедитесь, что вы хорошо отформатировали свои данные, как этого ожидают javascript.

<script>
    $(document).ready(function() {
            // page is now ready, initialize the calendar...
            alert("here");
            console.log("here");
            $('#calendar').fullCalendar({
             // put your options and callbacks here
                defaultView: 'agendaWeek',
                events : [{{$myrecords_from_my_view}}]
            })
        });
</script>

Answer 2

ваш javascript код работает нормально, проверьте ниже фрагмента, но у вас есть другая проблема в вашем коде, возможно, проблема в генерации события

<div id="calendar"></div>

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.17.1/moment.min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.1.0/fullcalendar.min.js'></script>
<script>
    $(document).ready(function() {
            // page is now ready, initialize the calendar...
            alert("here");
            console.log("here");
            $('#calendar').fullCalendar({
                // put your options and callbacks here
                defaultView: 'agendaWeek',
                events : [    ]
            })
        });
    </script>