I'm working on a fullcalendar module for my page.I could display Events on calendar without the recurring feature. But when I altered my table to include recurring features I could not display events from the table.
This is my table structure.
The Update function in controller is called while the form is submitted and i noticed that it is being updated in the table.This is my form.
and this is my controller update function.
public function update($id)
{
//$type=Input::get('type');
$event_id= Input::get('eventid');
$title= Input::get('title');
$start_day=Input::get('start');
$end_day=Input::get('end');
$allday=Input::get('allday');
$repeat=Input::get('repeat');
$frequency=Input::get('frequency');
$start_time=Input::get('start_time');
$end_time=Input::get('end_time');
$dow=Input::get('dow');
$month=Input::get('month');
$weekly_json=json_encode($dow);
$monthly_json=json_encode($month);
$newstrt=substr($start_day,0,10);
$newend=substr($end_day,0,10);
$start= date("Y-m-d H:i:s",$newstrt);
$end= date("Y-m-d H:i:s" , $newend);
$roles = DB::table('events')
->where('event_id','=',$event_id)
->update(array('title' => $title,'daily'=>$allday,'repeat'=>$repeat,'frequency'=>$frequency,'start'=>$start,'end'=>$end,'time'=>$time,'dow'=>$weekly_json,'monthly_json'=>$monthly_json));
if (Request::ajax())
{
return Response::json(array('id'=>$event_id,'title'=>$title,'newstrt'=>$start,'newend'=>$end,'start_time'=>$start_time,'end_time'=>$end_time));
}
else
{
return Redirect::route('calendar.index');
}
}
But I'm not being able to display these details on the full calendar.I was following this link to implement recurring events on fullcalendar.
Recurring Events in FullCalendar.
This is my index function used for GETting details from the table.
public function index()
{
$event = DB::table('events')
->leftJoin('people','people.people_id','=','events.people_id')
->where('events.flag', '=', 1)
->get(array('events.event_id','events.title','events.start','events.end','events.start_time','events.end_time','events.repeat','events.frequency','events.dow'));
$id=array(array());
$temp = array(array());
$i=0;
foreach ($event as $events)
{
$j=0;
$id[$i]["event_id"]=$events->event_id;
$id[$i]["title"]=$events->title;
$temp[$j]['start']=$events->start;
$temp[$j]['end'] = $events->end;
$temp[$j]['start_time']=$events->start_time;
$temp[$j]['end_time'] = $events->end_time;
$start_json=json_encode($temp);
$id[$i]['range'] = $start_json;
$id[$i]["frequency"]=$events->frequency;
$id[$i]["repeat"]=$events->repeat;
$id[$i]["dow"]=$events->dow;
$i++;
}
return Response::json($id);
}
This is my calendar eventrender function and events structure.
var date = new Date();
var d = date.getDate();
var m = date.getMonth();
var y = date.getFullYear();
var repeatingEvents = [{
url: '/v1/calendar/',
type: 'GET',
ranges: [{ //repeating events are only displayed if they are within one of the following ranges.
start: moment().startOf('week'), //next two weeks
end: moment().endOf('week').add(7,'d'),
},{
start: moment('2015-02-01','YYYY-MM-DD'), //all of february
end: moment('2015-02-01','YYYY-MM-DD').endOf('month'),
}],
}];
console.log(repeatingEvents);
var getEvents = function( start, end ){
return repeatingEvents;
}
var calendar=$('#calendar');
$.ajax({
url: '/v1/calendar/',
type: 'GET',
dataType:'json',
success:function events(response)
{
console.log(response);
calendar.fullCalendar({
header: {
left: 'prev,next today',
center: 'title',
right: 'month,agendaWeek,agendaDay'
},
eventRender: function(event, element, view){
console.log(event.start.format());
return (event.range.filter(function(range){
return (event.start.isBefore(range.end) &&
event.end.isAfter(range.start));
}).length)>0;
},
events: function( start, end, timezone, callback ){
var events = getEvents(start,end); //this should be a JSON request
callback(events);
},
editable: true,
droppable: true, // this allows things to be dropped onto the calendar
drop: function() {
// is the "remove after drop" checkbox checked?
if ($('#drop-remove').is(':checked')) {
// if so, remove the element from the "Draggable Events" list
$(this).remove();
}
},
eventSources: [
{
url: '/v1/calendar/',
type: 'GET',
dataType:'json',
},
calendar.fullCalendar( 'addEventSource', response )
],
selectable: true,
selectHelper: true,
select: function(start, end, allDay)
and I am getting JSON response like this on the console.
dow: "{[0,1,2]↵}"
event_id: 1
frequency: "weekly"
range: "[{"start":"2015-09-11","end":"2015-09-12","start_time":"11:00:00","end_time":"15:00:00"}]"
repeat: 1
title: "Youth festival"
I get no errors on the console....but the events aren't displayed too..
where did i go wrong? Helps guys?
See this code, i am also facing
After that I use this idea ,its working
In Controller
$vendor_holiday = Vendor::all();
return view('vendorpanel/holidays/index', compact('vendor_holiday'));
<script>
var calendar = $('#calendar').fullCalendar({
editable: false,
header: {
left: 'prev,next today',
center: 'title',
right: 'month'
},
events: [
#foreach($vendor_holiday as $vendor_holiday)
{
title : "",
start : '{{ $vendor_holiday->start }}',
},
#endforeach
],
selectable: true,
selectHelper: true,
select: function (start, end, allDay) {
$.ajaxSetup({
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
}
});
var start = moment(start).format('YYYY-MM-DD');
var end = moment(end).format('YYYY-MM-DD');
var vendor_id = $("#vendor_id").val();
var tdate = new Date();
var dd = tdate.getDate(); //yields day
var MM = tdate.getMonth(); //yields month
var yyyy = tdate.getFullYear(); //yields year
var currentDate= yyyy+ "-" +0+( MM+1) + "-" + dd;
if(start <= currentDate){
alert("Mark Holiday at least 1 day before");
return false;
}
if (confirm("Are you sure you want to Add a Holiday?")) {
$.ajax({
url: "/vendor/holidays",
type: "POST",
data: { vendor_id: vendor_id, start: start, end: end },
success: function (d) {
calendar.fullCalendar('refetchEvents');
alert(d);
location.reload();
},
})
}
},
eventClick: function (calEvent, jsEvent, view, event) {
$.ajaxSetup({
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
}
});
if (confirm("Are you sure you want to remove it?")) {
var start = calEvent.start.format();
var vendor_id = $("#vendor_id").val();
$.ajax({
url: '/vendor/holidays/'+vendor_id,
type: "DELETE",
data: { _method: 'delete', start: start },
success: function (d) {
$('#calendar').fullCalendar('removeEvents', calEvent._id);
alert(d);
},
error: function (data) {
alert(data);
}
});
}
},
});
</script>
Laravel - Recurring event occurrences generator and organiser.
Calendarful is a simple and easily extendable PHP solution that allows the generation of occurrences of recurrent events, thus eliminating the need to store hundreds or maybe thousands of occurrences in a database or other methods of storage.
This package ships with default implementations of interfaces for use out of the box although it is very simple to provide your own implementations if needs be.
It is compliant with PSR-2.
Installation
This package can be installed via Composer:
https://github.com/Vij4yk/calendarful
$ composer require plummer/calendarful
It requires PHP >= 5.3.0
Try this package.
Related
I need your help to understand the behaviour of my instance of FullCalendar Scheduler v5.5.0.
My event source is a JSON array generated by a basic SQL request from database, each event with it's own unique id as usual.
I'm using some jQuery code to make ajax calls to insert / update / delete events.
Everything works well but when i want to delete multiple events one after another without reloading page, then the ajax call to delete script is done multiple times for each event.
e.g : I want to delete the event with the id 2674, I click the button made for and it triggers the ajax call to the delete script (at this step i can see one call to the delete.php page in the network tab of the devtool console with the id 2674 in the post request) and everything is ok, event is deleted on the view.
But when I delete another event just after (id: 2631), then I have 3 calls to the delete script, the first and second with the id 2674 in the post request (the event I have deleted first) and the last one with the id 2631 as expected.
If I repeat this action again i have 6 calls to the delete.php page:
the first and second with the id 2674 in the post request (the event i have deleted first),
the third with the id 2631 (the event i have deleted in second),
the 4th with the id 2674 (the event i have deleted first),
the 5th with the id 2631 (the event i have deleted in second),
and the last one with the id 2651 as expected.
Here is my code, do you have an idea to explain this behavior ?
document.addEventListener('DOMContentLoaded', function() {
var initialLocaleCode = 'fr';
var url ='./';
var calendarEl = document.getElementById('calendar');
var calendar = new FullCalendar.Calendar(calendarEl, {
locale: 'fr',
firstDay: 1,
hiddenDays: [0], // hide Tuesdays and Thursdays
selectable: true,
slotDuration: '00:20:00',
slotMinTime: '08:00:00',
slotMaxTime: '20:00:00',
allDaySlot: false,
headerToolbar: {
left: 'prev next today',
center: 'title',
//right: 'resourceTimeGridDay,dayGridMonth,timeGridDay,listDay,listWeek'
right: 'resourceTimeGridDay,resourceTimeGridSixDay,dayGridMonth'
},
titleFormat: { // will produce something like "Tuesday, September 18, 2018"
month: 'long',
year: 'numeric',
day: 'numeric',
weekday: 'long'
},
views: {
listDay: { buttonText: 'list day' },
listWeek: { buttonText: 'list week' },
dayGridMonth: { buttonText: 'Mois' },
timeGridDay: { buttonText: 'Jour' },
resourceTimeGridDay: { buttonText: 'Jour'},
resourceTimeGridSixDay: {
type: 'resourceTimeGrid',
duration: { days: 6 },
buttonText: 'Semaine',
}
},
datesAboveResources:true,
nowIndicator: true,
contentHeight: 900,
initialView: 'resourceTimeGridDay',
initialDate: curdate,
navLinks: true, // can click day/week names to navigate views
editable: true,
dayMaxEvents: true, // allow "more" link when too many events
resources: [
{
title: 'Frédéric Xavier',
id: 'fred'
}, {
title: 'Emmanuelle Chouin',
id: 'manu'
}
],
eventDidMount: function(info) {
var start = info.event.start;
var end = info.event.end;
var startTime;
var endTime;
if (!start) {
startTime = '';
} else {
startTime = start;
startevent = start.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' });
}
if (!end) {
endDate = '';
endevent ='';
} else {
endTime = end;
endevent = end.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' });
}
var title = startevent + " - " + endevent + " " + info.event.title;
var description = info.event.extendedProps.description;
if (!info.event.extendedProps.description) {
description = '';
}
$(info.el).popover({
title: title,
placement:'top',
trigger : 'hover',
content: description,
container:'body'
});
$('.popover.in').remove(); //<--- Remove the popover
//$(info.el).popover('show');
if(info.event.extendedProps.description){
$(info.el).find(".fc-event-title").append(" <i class='fas fa-exclamation-triangle fa-lg red-text'></i>");
}
},
dateClick: function(info) {
$('#event').modal('show');
var str = info.dateStr
$('#datedeb').val(str.substring(0,10)).focusin();
$('#heuredeb').val(str.substring(11, str.indexOf(':00+'))).focusin();
$("input[name='resource'][value='" + info.resource.id + "']").prop('checked', true);
var twentyMinutesLater = new Date(str);
twentyMinutesLater.setTime(twentyMinutesLater.getTime() + 20*60000);
var test = twentyMinutesLater + ' ';
$('#heurefin').val(removeN(test, 16).substring(0,5)).focusin();
},
select: function(info) {
var str = info.startStr
var str2 = info.endStr
$('#event').modal('show');
$('#datedeb').val(str.substring(0,10)).focusin();
$('#heuredeb').val(str.substring(11, str.indexOf(':00+'))).focusin();
$("input[name='resource'][value='" + info.resource.id + "']").prop('checked', true);
$('#heurefin').val(str2.substring(11, str2.indexOf(':00+'))).focusin();
},
events: url+'api/load.php',
eventDrop: function(arg) {
var madate = arg.event.startStr;
var datedeb = madate.substring(0,10);
var heuredeb = madate.substring(11,madate.indexOf(':00+'))
var end = arg.event.endStr;
var heurefin = end.substring(11,end.indexOf(':00+'))
$.ajax({
url:url+"/api/update.php",
type:"POST",
data:{id:arg.event.id, date:datedeb, start:heuredeb, end:heurefin, title:arg.event.title,color:arg.event.backgroundColor, commentaire:arg.event.extendedProps.description, resource:arg.event._def.resourceIds[0]},
});
calendar.refetchEvents();
},
eventDragStop: function(arg) {
$('.popover').remove(); //<--- Remove the popover
calendar.refetchEvents();
$('.popover').remove(); //<--- Remove the popover
},
eventResize: function(arg) {
var madate = arg.event.startStr;
var datedeb = madate.substring(0,10);
var heuredeb = madate.substring(11,madate.indexOf(':00+'))
var end = arg.event.endStr;
var heurefin = end.substring(11,end.indexOf(':00+'))
$.ajax({
url:url+"api/update.php",
type:"POST",
data:{id:arg.event.id, date:datedeb, start:heuredeb, end:heurefin, title:arg.event.title,color:arg.event.backgroundColor, commentaire:arg.event.extendedProps.description, resource:arg.event._def.resourceIds[0]},
});
calendar.refetchEvents();
//location.reload();
},
eventClick: function(arg) {
var id = arg.event.id;
$('#editEventId').val(id);
$('#deleteEvent').attr('data-id', id);
//$('#modif').modal('show');
$.ajax({
url:url+"api/getevent.php",
type:"POST",
dataType: 'json',
data:{id:id},
success: function(data) {
$('#edit-nom').val(data[0].title).focusin();
$('#edit-commentaire').val(data[0].description).focusin();
$('#edit-datedeb').val(data[0].start.substring(0,10)).focusin();
//alert(data[0].start.substring(11,data[0].start.indexOf(':00')));
$('#edit-heuredeb').val(data[0].start.substring(11,data[0].start.length+5)).focusin();
$('#edit-heurefin').val(data[0].end.substring(11,data[0].end.length+5)).focusin();
$("input[name='editcolor'][value='" + data[0].backgroundColor + "']").prop('checked', true);
$("input[name='edit-resource'][value='" + data[0].resourceId + "']").prop('checked', true);
$('.Nom').replaceWith('<span class="Nom font-weight-bold text-danger">'+data[0].title+'</span>');
$('#modif').modal('show');
}
});
$(document).on('click', '#deleteEvent', function() {
$('#modif').modal('hide');
$('#modalConfirmDelete').modal('show');
$('#delete').replaceWith('<button type="button" class="btn btn-outline-danger" id="delete" data-id="'+id+'">Oui</button>');
$(document).on('click', '#delete', function() {
$.ajax({
url:url+"api/delete.php",
type:"POST",
cache : false,
data:{id:id},
success: function(msg) {
console.log(msg);
$('#modalConfirmDelete').modal('hide');
calendar.refetchEvents();
},
});
});
});
}
});
calendar.render();
$(document).on('click', '#createEvent', function(event) {
var request_method = $("#form").attr("method");
var post_url = $( "#form").attr('action');
var post_data = $( "#form" ).serialize();
$.ajax({
type: request_method,
url: post_url,
data: post_data,
success: function(msg) {
$("#form")[0].reset();
$('#event').modal('hide');
console.log(msg);
calendar.refetchEvents();
},
error: function(msg) {
console.log(msg);
}
});
});
$(document).on('click', '#editEvent', function(event) {
var request_method = $("#formupdate").attr("method");
var post_url = $( "#formupdate").attr('action');
var post_data = $( "#formupdate" ).serialize();
$.ajax({
type: request_method,
url: post_url,
data: post_data,
success: function(msg) {
console.log(msg);
$("#formupdate")[0].reset();
$('#modif').modal('hide');
calendar.refetchEvents();
},
error: function(msg) {
console.log(msg);
}
});
});
});
The problem is you are piling up event handlers. Every time you click on any event on the calendar, eventClick runs. Within event click, you run $(document).on('click', '#deleteEvent', function() { which adds a new "click" handler to show the deletion modal. Then every time the modal is shown, it runs $(document).on('click', '#delete', function() { which adds a new "click" event handler to the Delete button...but your code never removes any of the event handlers which were previously added to those buttons.
Therefore it appears to work fine the first time you delete something, but subsequently if you press Delete again, it will run all the "click" event handlers associated with the button. That's why you can see it running requests for events you had deleted previously - it's re-running event handlers which are still attached to the button. You can use off() in jQuery to remove existing event handlers from an element.
e.g.
$(document).off('click', '#deleteEvent');
$(document).on('click', '#deleteEvent', function() {
//....
$(document).off('click', '#delete');
$(document).on('click', '#delete', function() {
First or all.. i have browsed through tons of material and examples on this, but i cannot figure it out eitherhow..
Scenario :
Running on ASP.NET using Web Api 2...
API is called to fetch events, objects seems legit :
Issue seems to be that callback is never true..
Code :
$(document).ready(function() {
var date = new Date();
var d = date.getDate();
var m = date.getMonth();
var y = date.getFullYear();
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) {
calendar.fullCalendar('renderEvent',
{
title: title,
start: start,
end: end,
allDay: allDay
},
true // make the event "stick"
);
}
calendar.fullCalendar('unselect');
},
editable: true,
events: function (start, end, callback) {
$.ajax({
type: "GET", //WebMethods will not allow GET
url: "api/Calendar/GetCalendarEvents/" + getQueryVariable("teamid"),
//completely take out 'data:' line if you don't want to pass to webmethod - Important to also change webmethod to not accept any parameters
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (doc) {
var events = []; //javascript event object created here
var obj = doc;
$(obj).each(function () {
events.push({
title: $(this).attr('title'), //your calevent object has identical parameters 'title', 'start', ect, so this will work
start: $(this).attr('start'), // will be parsed into DateTime object
end: $(this).attr('end'),
id: $(this).attr('id')
});
});
if (callback) callback(events);
}
});
}
});
According to the official doc https://fullcalendar.io/docs/event_data/events_function/, function for programmatically generating Event Objects
function( start, end, timezone, callback ) { }
You should replace your events function with this:
events: function (start, end, timezone, callback) {
$.ajax({
type: "GET", //WebMethods will not allow GET
url: "api/Calendar/GetCalendarEvents/" + getQueryVariable("teamid"),
//completely take out 'data:' line if you don't want to pass to webmethod - Important to also change webmethod to not accept any parameters
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (doc) {
var events = []; //javascript event object created here
var obj = doc;
$(obj).each(function () {
events.push({
title: $(this).attr('title'), //your calevent object has identical parameters 'title', 'start', ect, so this will work
start: $(this).attr('start'), // will be parsed into DateTime object
end: $(this).attr('end'),
id: $(this).attr('id')
});
});
if (callback) callback(events);
}
});
}
Because when you are calling with three parameters, fourth param callback is empty, that's the reason of not getting events.
I am developing an ASP.Net MVC application. In one of my views, I am using FullCalendar control.
I am having 2 issues with my fullcalendar control -
My First issue is - On event click function, I am calling an action of some other controller from a Javasript function. My script is -
<script>
$(document).ready(function () {
var sourceFullView = { url: '/Calendar/GetDiaryEvents/' };
var sourceSummaryView = { url: '/Calendar/GetDiaryEvents/' };
var CalLoading = true;
$('#calendar').fullCalendar({
header: {
left: 'prev,next today',
center: 'title',
right: 'month'
},
defaultView: 'month',
editable: true,
allDaySlot: false,
selectable: true,
slotMinutes: 15,
events: '/Calendar/GetDiaryEvents/',
eventClick: function (calEvent, jsEvent, view) {
if (!confirm('You selected Election ID: ' + calEvent.title
+ "\nElection Date: " + calEvent.start.toDateString()
+ "\n\nDo you want to Vote for this Election?")) {
return;
}
var electionID = calEvent.id;
$.ajax({
url: '#Url.Action("Tally", "Voting")',
type: 'GET',
dataType: 'json',
cache: false,
data: { id: calEvent.id }
});
},
eventResize: function (event, dayDelta, minuteDelta, revertFunc) {
if (confirm("Confirm change appointment length?")) {
UpdateEvent(event.id, event.start, event.end);
}
else {
revertFunc();
}
},
viewRender: function (view, element) {
if (!CalLoading) {
if (view.name == 'month') {
$('#calendar').fullCalendar('removeEventSource', sourceFullView);
$('#calendar').fullCalendar('removeEvents');
$('#calendar').fullCalendar('addEventSource', sourceSummaryView);
}
}
}
});
CalLoading = false;
});
</script>
This is calling Tally method of VotingController -
[HttpGet]
public ActionResult Tally(int id)
{
return View(id);
}
When I debug through View of Tally then also it is looking fine but the new view called from action Tally is not loaded and browser still shows my calendar control.
My second issue is I want to display only monthly calendar. When I click next or prev button on calendar then my GetDiaryEvents function is called thrice.
Try to use a JsonResult in the Tally method. You could also render the view to string and include it in the json return.
[HttpGet]
public JsonResult Tally(int id)
{ //fill your model
return Json( new { viewdata=model } );
}
And in the ajax call return you just need to read json return object
success: function (return) {
$("#element").append(return.viewdata);
}
I am using FullCalendar for a doctor / patient appointment system. I want to show doctor availability in patient screen using FullCalendar. I am using the dayRender function, but is it showing me the next days date, specifically for EST time zone. Can anyone let me know what I am missing over here?
dayRender: function (date, cell) {
var view = $('#calendar').fullCalendar('getView');
var strDay = moment(date._d).format('YYYY-MM-DD');
$.ajax({
url: '/client/profile/ajaxexpertappointentclientday',
data: 'strDate='+strDay ,
type: "POST",
async:false,
success: function(intFlag) {
var today = moment();
if(intFlag == 1 && strDay >= strTodaysDate && strDay < moment(today._d).add('days', 2).format('YYYY-MM-DD')) {
cell.css("background-color", "red");
} else {
cell.css("background-color", "#F0F0F0");
}
}
});
}
},
I don't know exactly what of many fullCalendar you use.
I've used this http://fullcalendar.io/
Code example javascript
$('#calendar').fullCalendar(
{
timeFormat: {
agenda: 'H(:mm){ - H(:mm)}',
'': 'H(:mm){-H(:mm) }'
},
aspectRatio: 2,
selectable: true,
selectHelper: true,
editable: false,
theme: false,
eventColor: '#bcdeee',
eventSources: [
{
url: '/index.php',
type: 'POST',
data:
{
controller : "engineers",
action : "getCalendar"
},
error: function()
{
alert('there was an error while fetching events!');
}
}
],
loading: function(bool) {
$('#loading').toggle(bool);
},
eventClick: function(event)
{
// opens events in a popup window
window.open("?controller=audits&action=show&id="+event.id, '_blank').focus();
return false;
},
});
And the response from server must be like this:
[{"id":61,"title":"BOLOGNA (Bologna)","start":"2015-08-30 15:00:00+01:00","end":"2015-08-31 15:00:00+01:00","allDay":false,"color":null}]
if color attribute is setted on response JSON, will be the color of specific event.
http://fullcalendar.io/docs/event_rendering/eventColor/
You can use any of the CSS color formats such #f00, #ff0000,
rgb(255,0,0), or red.
When I create a new event, i POST it on the server with a tastypie REST API. When created, this event on the server has a new id, generated when is saved:
select: function (startDate, endDate, allDay, jsEvent, view) {
/* after selection user will be promted for enter title for event.*/
var title = prompt('Event Title:');
/*if title is enterd calendar will add title and event into fullCalendar. */
}
if (title) {
calendar.fullCalendar('renderEvent', {
title: title,
start: startDate,
end: endDate,
allDay: allDay
},
true // make the event "stick"
);
$.ajax({
url: 'http://localhost:8000/calendar/api/events/events/',
dataType: 'json',
contentType: 'application/json; encode=UTF-8',
type: 'POST',
data: JSON.stringify({
title: title,
start: startDate,
end: endDate,
allDay: allDay,
user: "/calendar/api/events/users/{{ user.id }}/"
}),
success: function (data) {
// Could i do something here?
}
});
console.log({{user.id}},'{{ user}}')
}
},
I need to update the event on the client memory, because the event just created, has an event id like "fc_1" or something similar, but i need the DB id, because if i immediately drag o resize the event, i can't update it on server because it will try to PUT this event, but with the wrong id (like "fc_1").
in your renderEvent object, you could add id: 'pending'. Then in your success function you can use the fullcalendar clientEvents function to get the array of events and then use updateEvent to add your new id value:
success: function(data) {
var newID = data.id;
var events = calendar.fullCalendar('clientEvents');
for(var i = 0; i < events.length; i++){
if(events[i].id == 'pending') {
events[i].id = newID;
calendar.fullCalendar('updateEvent', events[i]);
}
}
}