Enlever l'événement dans le Calendrier

Je suis à l'aide de JQuery Calendrier Complet avec Spring MVC.

Bonjour,
J'ai fait une démo comme que.

Cible: j'ai besoin lorsque l'utilisateur clique sur un événement qu'il est déjà inséré,une boîte de dialogue apparaît et donne-lui la capacité de supprimer l'événement ou de l'annuler.

Question: Maintenant, chaque fois que l'utilisateur clique sur un jour, une boîte de dialogue s'affiche pour permettre à l'utilisateur d'entrer un titre pour l'événement alors l'utilisateur clique sur "Ok" pour enregistrer l'événement.

Freemarker:
Freemarker:

<script type="text/javascript">
var resourceVacation;
function censor(censor) {
return (function() {
var i = 0;
return function(key, value) {
if (i !== 0 && typeof(censor) === 'object' && typeof(value) == 'object' && censor == value)
return '[Circular]';                   
++i; //so we know we aren't using the original object anymore
return value;
}
})(censor);
}
function doAjax() {
$.each(resourceVacation, function(index) {
var tmpDate = resourceVacation[index].start;
tmpDate.setHours(tmpDate.getHours() - tmpDate.getTimezoneOffset() / 60);
resourceVacation[index].start=tmpDate;
});
//       var arrays = [
//           {"id":111,"title":"event1","start":"2012-04-15T22:00:00.000Z","url":"http://yahoo.com/"}
//       ];
//       var objects = {"id":111,"title":"event2","start":"2012-04-16T22:00:00.000Z","url":"http://yahoo2.com/"};
//
//       arrays.push(objects);
var test = JSON.stringify(resourceVacation, censor(resourceVacation));
var x = test;
$.ajax(
{
url:"[@spring.url '/vacation/saveResourceVacation'/]",
type: "POST",
data :x ,
dataType: "json",
contentType: "application/json"
});
}
$(document).ready(function() {
var date = new Date();
var d = date.getDate();
var m = date.getMonth();
var y = date.getFullYear();
$.getJSON('[@spring.url '/vacation/loadResourceVacation'/]', function (data) {
var calendar = $('#calendar').fullCalendar({
header: {
left: 'prev,next today',
center: 'title',
right: 'month,agendaWeek,agendaDay'
},
selectable: true,
selectHelper: true,
select:
function(start, end, allDay) {
var title = prompt('Event Title:');
if (title) {
start.setHours(start.getHours() - start.getTimezoneOffset() / 60);
//                               var dat=$.fullCalendar.formatDate( start, "yyyy/MM/dd")
var newVacation= {id:133,title:'title',start:start,url: 'title'};
resourceVacation.push(newVacation);
calendar.fullCalendar('renderEvent',
{
title: title,
start: start,
end: end,
allDay: allDay
},
true //make the event "stick"
);
}
calendar.fullCalendar('unselect');
},
eventClick: function(calEvent, jsEvent, view) {
alert('Event: ' + calEvent.title);
alert('start: ' + calEvent.start);             
}
editable: true,
events:data
});
resourceVacation = data;
});
});
</script>

Contrôleur:

     @RequestMapping(value = "/vacation/loadResourceVacation", method = RequestMethod.GET)
public
@ResponseBody
String loadResourceVacation(HttpServletResponse response) throws Exception {
//Here I build my vacationFormBean
List<VacationFormBean> vacationFormBeanList= buildVacationFormBean();
//Convert to JSON string.
String json = new Gson().toJson(vacationFormBeanList);
//Write JSON string.
response.setContentType("application/json");
response.setCharacterEncoding("UTF-8");       
return json;
}
@RequestMapping(value = "/vacation/saveResourceVacation", method = RequestMethod.POST)
public
@ResponseBody
void saveResourceVacation(@RequestBody String jsonString, Principal principal) throws Exception {
List<String> resourceVacations = extractVacationDatesFromJsonObject(jsonString);
}

VacationFormBean:

public class VacationFormBean {
int id; //(With Setter & Getter)
String title; //(With Setter & Getter)
String start;  //(With Setter & Getter)
String url; //(With Setter & Getter)
}

J'ai besoin de quelque chose comme ça :

======================Mise à JOUR=========================

J'ai ajouter l'événement de clic comme un résultat de domi27 recomendation.
Veuillez examiner les freemarker mises à jour.
J'ai ajouté un script java de la méthode qui utilise :http://arshaw.com/fullcalendar/docs/event_data/removeEvents/

La nouvelle méthode JS :

   $('#calendar').fullCalendar('removeEvents', 1);

Cette méthode fonctionne parfaitement avec les événements qui a été initialement chargé à partir du contrôleur.
Cependant,chaque fois que j'essaie d'utiliser la même méthode pour supprimer les nouveaux événements, j'ai juste ajouté,Rien ne se passe.
Lorsque je lance la commande "sélectionner l'événement" pour le nouvel événement que j'ai créé ,je reçois pour ses id"undefined".

Comme je l'ai mentiond sur mon freemarker,qui sont les lignes que j'utilise pour construire le nouvel événement de l'objet que je aappend à la liste.

var newVacation = {id:'133',title:'title',start:start,url: 'title'};
resourceVacation.push(newVacation);

Quand je debug mon script,j'observe une différence entre les objets chargés à partir du contrôleur et le nouvel objet que j'ai créé lorsque l'utilisateur ajoute un nouvel événement.

Ici est l'ancien objet que j'ai reçu du contrôleur lorsque j'ai entamé le calendrier:

Voici le nouvel Objet que j'ai obtenu après j'ai insérer le nouvel événement:

OriginalL'auteur Echo | 2012-04-17