Add Event in Calender using JSP Page

Step 1:
          create jsp and

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

Step 2:
    add js file into the JSP 
     for eg:


<link rel='stylesheet' type='text/css' href='fullcalendar/fullcalendar.css' />
<link rel='stylesheet' type='text/css' href='fullcalendar/fullcalendar.print.css' media='print' />
<script type='text/javascript' src='extensions/jquery-1.3.2.min.js'></script>

Step 3:
  Add .css in JSP



<style type='text/css'>

body {
margin-top: 40px;
text-align: center;
font-size: 14px;
font-family: "Lucida Grande",Helvetica,Arial,Verdana,sans-serif;
}

#loading {
position: absolute;
top: 5px;
right: 5px;
}

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

</style>


Step 4:
   write code on script



<script type='text/javascript'>

$(document).ready(function() {


var calendar = $('#calendar').fullCalendar({
header: {
left: 'prev,next today',
center: 'title',
right: 'month,agendaWeek,agendaDay'
},
selectable: true,
selectHelper: true,
select: function(start, end, allDay) {

calendar.fullCalendar('unselect');
},
editable: true,


});


Step 5:

     Create servlet to getting event on table 
    or u direct Post the event on calender
    i am useint table for event

      write code on AJAX

$.ajax({ type: "Post", url: "Calender_Event",
data:{name:$("#Uname").val()},
cache:false,
success : function(data){

var objArray=JSON.parse(data);
 $.each(objArray, function(index,jsonObject){

   var subject = jsonObject.Description;  //the title of the event        
var dateStart = jsonObject.complDate;     // the day the event takes place
var events=new Array();  
event = new Object();    
event.title = subject;
event.start = dateStart;    // its a date string
//event.end = dateEnd;        // its a date string.
event.color = jsonObject.color;
event.allDay = false;
       event.url="Calender_Add_Report.jsp";
events.push(event);
$('#calendar').fullCalendar('addEventSource',events);

 });

  var altField = $( ".selector" ).datepicker( "option", "altField" );
 alert(altField);
}
});


Step 6:
Out Put