Uždarbis.lt: PHP ir JS kalendorius - Uždarbis.lt

Peršokti prie turinio



IT paslaugų skelbimams skirta skiltis Dizaino ir programavimo paslaugos
Puslapis 1 iš 1
  • Jūs negalite kurti naujos temos
  • Jūs negalite atsakyti į šią temą

Narys yra atsijungęs Majakas69 

  • Senas slapyvardis - Vaidelis
  • AkisAkisAkis
  • Grupė: Patvirtinti nariai
  • Atsiliepimai: +14 -0
  • Pranešimai: 408
  • Kartu nuo: 2009-10-24

2019-04-10 21:17 (#1)

PHP ir JS kalendorius


Sveiki,
gal kas patarsite kaip pakeisti JS kodą, jog veiktu norimas dalykas.

Esmė tame jog naudoju šį kalendorių (Mano nuoroda) tačiau jis nuskaito iš mysql pagal vieną datą stulpelyje. Pvz: langelyje datą yra: 2018-01-01 ir ją pažymį kalendoriuje ir atvaizduoja "Title".

Bet esmė tokia jog langelyje datų daugiau

Paveiksliukas

Kaip pakeisti JS kodą jog pažymėtų visas langelyje 1rašytas datas kalendoriuje ir pridėtų tą patį TITLE?

<!DOCTYPE html>
<html>

<head>
<link rel="stylesheet" href="fullcalendar/fullcalendar.min.css" />
<script src="fullcalendar/lib/jquery.min.js"></script>
<script src="fullcalendar/lib/moment.min.js"></script>
<script src="fullcalendar/fullcalendar.min.js"></script>

<script>

$(document).ready(function () {
    var calendar = $('#calendar').fullCalendar({
        editable: true,
        events: "fetch-event.php",
        displayEventTime: false,
        eventRender: function (event, element, view) {
            if (event.allDay === 'true') {
                event.allDay = true;
            } else {
                event.allDay = false;
            }
        },
        selectable: true,
        selectHelper: true,
        select: function (start, end, allDay) {
            var lesson = prompt('Event lesson:');

            if (lesson) {
                var start = $.fullCalendar.formatDate(start, "Y-MM-DD HH:mm:ss");
                var end = $.fullCalendar.formatDate(end, "Y-MM-DD HH:mm:ss");

                $.ajax({
                    url: 'add-event.php',
                    data: 'lesson=' + lesson + '&start=' + start + '&end=' + end,
                    type: "POST",
                    success: function (data) {
                        displayMessage("Added Successfully");
                    }
                });
                calendar.fullCalendar('renderEvent',
                        {
                            lesson: lesson,
                            start: start,
                            end: end,
                            allDay: allDay
                        },
                true
                        );
            }
            calendar.fullCalendar('unselect');
        },
        
        editable: true,
        eventDrop: function (event, delta) {
                    var start = $.fullCalendar.formatDate(event.start, "Y-MM-DD HH:mm:ss");
                    var end = $.fullCalendar.formatDate(event.end, "Y-MM-DD HH:mm:ss");
                    $.ajax({
                        url: 'edit-event.php',
                        data: 'lesson=' + event.lesson + '&start=' + start + '&end=' + end + '&id=' + event.id,
                        type: "POST",
                        success: function (response) {
                            displayMessage("Updated Successfully");
                        }
                    });
                },
        eventClick: function (event) {
            var deleteMsg = confirm("Do you really want to delete?");
            if (deleteMsg) {
                $.ajax({
                    type: "POST",
                    url: "delete-event.php",
                    data: "&id=" + event.id,
                    success: function (response) {
                        if(parseInt(response) > 0) {
                            $('#calendar').fullCalendar('removeEvents', event.id);
                            displayMessage("Deleted Successfully");
                        }
                    }
                });
            }
        }

    });
});

function displayMessage(message) {
	    $(".response").html("<div class='success'>"+message+"</div>");
    setInterval(function() { $(".success").fadeOut(); }, 1000);
}
</script>

<style>
body {
    margin-top: 50px;
    text-align: center;
    font-size: 12px;
    font-family: "Lucida Grande", Helvetica, Arial, Verdana, sans-serif;
}

#calendar {
    width: 700px;
    margin: 0 auto;
}

.response {
    height: 60px;
}

.success {
    background: #cdf3cd;
    padding: 10px 60px;
    border: #c3e6c3 1px solid;
    display: inline-block;
}
</style>
</head>
<body>
    <h2>PHP Calendar Event Management FullCalendar JavaScript Library</h2>

    <div class="response"></div>
    <div id='calendar'></div>
</body>


</html>


0


Pasidalinti šia tema:


Puslapis 1 iš 1
  • Jūs negalite kurti naujos temos
  • Jūs negalite atsakyti į šią temą

1 nariai(-ų) skaito šią temą
0 nariai(-ių), 1 svečiai(-ių) ir 0 slapti(-ų) nariai(-ių)


Užklausų vykdymo statistika

  • Dabar yra: 2019-04-20 20:30

Tas nuostabus prisijungimo momentas


Prisijungimo nustatymai