Mysql
 sql >> Datenbank >  >> RDS >> Mysql

Verwenden Sie FullCalendar ohne Datum

Soll diese Tabelle ein HTML-Dokument oder ein Excel-Dokument sein?

Endlich habe ich das geschafft.

Hier ist der HTML- und JS-Code für die Seite:

<!DOCTYPE html>

<html>
<head>
<meta charset='utf-8' />
<link href='/something/fullcalendar.min.css' rel='stylesheet' />
<link href='/something/fullcalendar.print.min.css' rel='stylesheet' media='print' />
<script src='/something/lib/moment.min.js'></script>
<script src='/something/lib/jquery.min.js'></script>
<script src='/something/fullcalendar.min.js'></script>
<script>
    Date.prototype.getWeek = function(start)
    {
        //Calcing the starting point
    start = start || 0;
    var today = new Date(this.setHours(0, 0, 0, 0));
    var day = today.getDay() - start;
    var date = today.getDate() - day;

        // Grabbing Start/End Dates
    var StartDate = new Date(today.setDate(date));
    var EndDate = new Date(today.setDate(date + 6));
    return [StartDate, EndDate];
    }

    // test code
    var Dates = new Date().getWeek();
    for(i = 0; i < Dates.length; i++) {
        day = Dates[i].getDate();
        month = (Dates[i].getMonth()) + 1;
        year = Dates[i].getFullYear();

         Dates[i] = year + '-' + month + '-' + day;
    }


    $(document).ready(function() {

        $('#calendar').fullCalendar({
              header: false,
              columnFormat: 'dddd',
              allDaySlot: false,
              hiddenDays: [0],
              defaultView: 'agendaWeek',
              minTime: '07:00:00',
              maxTime: '21:00:00',
              editatble: true,
        });
        $.post( "getevents.php",
                {'getEvents': 1, 'startDate': Dates[0], 'endDate': Dates[1]},
                function(data) {
                    var array = JSON.parse(data);
                    for(i = 0; i < array.length; i ++) {
                        $('#calendar').fullCalendar( 'renderEvent', {
                            title: 'Sometitle',
                            start: array[i]['date']+'T'+array[i]['start_time'], //what I would like to input
                            end: array[i]['date']+'T'+array[i]['end_time'],
                        } );
                    }
                }
            );

    });

</script>
<style>

    body {
        margin: 40px 10px;
        padding: 0;
        font-family: "Lucida Grande",Helvetica,Arial,Verdana,sans-serif;
        font-size: 14px;
    }

    #calendar {
        max-width: 900px;
        margin: 0 auto;
    }

</style>
</head>
<body>

    <div id='calendar'></div>

</body>
</html>

Hier ist der PHP-Code für getevents.php :

<?php
    $db = new mysqli('localhost', 'root', '', 'calendar'); // connection to db

    function formWeekDates($startDate, $endDate) {
        $startDay = getDay($startDate);
        $endDay = getDay($endDate);
        $tmp = explode('-', $startDate);

        $return = array();
        for($i = intval($startDay); $i <= intval($endDay); $i++) {
            if($i > 0 && $i < 10) {
                $i = '0'.$i;
            }
            $return[] = '\''.$tmp[0].'-'.$tmp[1].'-'.$i.'\'';
        }

        return $return;
    }

    function getDay($date) { //$date in format 'yyyy-mm-dd'
        return end(explode('-', $date));
    }
    if(isset($_POST['getEvents']) && isset($_POST['startDate']) && isset($_POST['endDate'])) {
        $startDate = $_POST['startDate'];
        $endDate = $_POST['endDate'];
        $dates = implode(',', formWeekDates($startDate, $endDate));
        $result = $db->query("SELECT * FROM `calendar` WHERE `date` IN ($dates)");
        $return = array();
        while($row = $result->fetch_assoc()) {
            $return[] = $row;
        }

        echo json_encode($return);
        // echo json_encode($dates);
    }
?>

Außerdem habe ich der Datenbank die Spalte „Datum“ hinzugefügt, in der ich das Datum im Format „JJJJ-MM-TT“ gespeichert habe

P.S. Dieser Code ist vielleicht etwas verzögert, aber er funktioniert

P.S.S. Ich habe gesehen, dass Sie diesen Kalender erstellen möchten, ohne Daten zu verwenden. Aber ich habe keine Möglichkeit dazu gefunden. Sie können Daten vor Benutzern verbergen und in PHP-Code verarbeiten