Skip to content

All topics  /  General

Fullcalendar Get Selected Date Example

General ·

Hi Guys,

Now let's see example of how to get selected date in fullcalendar using jquery. In this article we will talk about fullcalendar get selected date. It's simple example of how to get selected date in fullcalendar using jquery. This article will give you how to get selected date on date click in fullcalendar.

Here i will give you full example for get selected date in fullcalendar using jqury So let's see the bellow example.

Example 


<!DOCTYPE html>
<html>
<head>
    <title>Fullcalendar Get Selected Date Using Jquery Example</title>
    <link href="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/2.1.1/fullcalendar.min.css" rel="stylesheet"/>
    <link href="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/2.1.1/fullcalendar.print.css" rel="stylesheet" media="print"/>
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet" >
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.8.3/moment.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/2.1.1/fullcalendar.min.js"></script>
</head>
<body>
<div class="container">
    <div class="row">
        <div class="col-md-12 mt-5 mb-5">
            <div id="calendar"></div>
        </div>
    </div>
</div>
<script type="text/javascript">
    $('#calendar').fullCalendar({
    selectable: true,
    select: function(start, end, jsEvent, view) {
        var allDay = !start.hasTime() && !end.hasTime();
        console.log(["Selected Date : " + moment(start).format('DD/MM/YYYY')]);
        alert(["Selected Date : " + moment(start).format('DD/MM/YYYY')]);}
    });
</script>
</body>
</html>

It will help you....

More on this topic