Listo aqui los adjunto.
Json:
Código PHP:
<?php
require ('/config.php');
$link = mysql_connect("$hotsdb","$usuariodb","$clavedb") or die(mysql_error());
mysql_select_db('calendario',$link);
$query = "SELECT title, start, end FROM calendar";
$result = mysql_query($query) or die(mysql_error());
$arr = array();
while($row = mysql_fetch_assoc($result)){
$arr[] = $row;
}
echo json_encode($arr);
?>
Resutado:
Index:
Código PHP:
<link href="fullcalendar-2.6.1/fullcalendar.css" rel='stylesheet' />
<script src="fullcalendar-2.6.1/lib/jquery.min.js"></script>
<script src="fullcalendar-2.6.1/lib/jquery-ui.custom.min.js"></script>
<script type="text/javascript" src="fullcalendar-2.6.1/lib/moment.min.js"></script>
<script type="text/javascript" src="fullcalendar-2.6.1/fullcalendar.min.js">
</script>
<script>
$(document).ready(function() {
var date = new Date();
var d = date.getDate();
var m = date.getMonth();
var y = date.getFullYear();
var calendar = $('#calendar').fullCalendar({
//configure options for the calendar
header: {
left: 'prev,next today',
center: 'title',
right: 'agendaWeek,agendaDay'
},
events: {
url: 'reservas.php',
allDay: false
},
buttonText:{
today: 'Hoy',
month: 'Mes',
week: 'Semana',
day: 'Dia'
},
editable: false,
defaultView: 'agendaWeek',
allDaySlot:false,
titleFormat: 'MMMM',
axisFormat: 'HH:mm',
timeFormat: 'HH:mm{ - HH:mm}',
slotDuration: '00:60:00',
slotEventOverlap: false,
columnFormat: {
// Monday, Wednesday, etc
week: 'ddd D',
day: 'dddd D' // Monday 9/7
},
monthNames: ['Enero','Febrero','Marzo','Abril','Mayo','Junio','Julio','Agosto','Septiembre','Octubre','Noviembre','Diciembre'],
monthNamesShort: ['Ene','Feb','Mar','Abr','May','Jun','Jul','Ago','Sep','Oct','Nov','Dic'],
dayNames: ['Domingo','Lunes','Martes','Miércoles','Jueves','Viernes','Sábado'],
dayNamesShort: ['Dom','Lun','Mar','Mié','Jue','Vie','Sáb'],
minTime: "09:00"
});
});
</script>
<style type='text/css'>
body {
margin-top: 40px;
text-align: center;
font-size: 16px;
font-family: "Lucida Grande",Helvetica,Arial,Verdana,sans-serif;
}
#calendar {
margin: 0 auto;
width: 515px;
}
</style>
</head>
<body>
<div id='calendar'></div>
</body>
</html>
Resultado:
