24-Oct-2020
.
Admin
Hi Guys,
In this blog, i am going to teach you how to get event date on click in fullcalendar using jquery. We will show get event date on click in fullcalendar using jquery. This tutorial will give you fullcalendar get event date on click using jquery.
Now let's see example of fullcalendar get date on event click. I will give simple and easy way to get date on event click in fullcalendar using jquery. So let's see the bellow example.
Example
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>Fullcalendar Get Event Date On Click Example Using Jquery</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/fullcalendar@5.3.1/main.min.css"/>
</head>
<style type="text/css">
#calendar {
width:60%;
margin: 20px auto;
}
</style>
<body>
<div class="container">
<div class="row">
<div class="col-md-12 text-center">
<div id="calendar"></div>
</div>
</div>
</div>
</body>
<script src="https://code.jquery.com/jquery-2.1.4.js"></script>
<script src="https://cdn.jsdelivr.net/npm/fullcalendar@5.3.1/main.min.js"></script>
<script src="https://fullcalendar.io/assets/demo-to-codepen.js"></script>
<script type="text/javascript">
document.addEventListener('DOMContentLoaded', function() {
var calendarEl = document.getElementById('calendar');
var calendar = new FullCalendar.Calendar(calendarEl, {
eventClick: function(info) {
var eventObj = info.event;
if (eventObj.start) {
alert('Clicked' + eventObj.start);
}
},
events: [
{
title: 'simple event',
start: '2020-10-02'
},
{
title: 'New Event',
start: '2020-10-03'
}
]
});
calendar.render();
});
</script>
</html>
It will help you....
#Jquery
#Fullcalendar
