FullCalendar 2.3.1
http://fullcalendar.io/
Ruby 2.1.5 p273
Rails 4.2.1
I use a jQuery plug-in called FullCalender to create a calendar that can be rewritten by Rails and ajax.
Event creation, reading, updating, and deletion worked pretty well, but only certain cases cannot be deleted.
Also, we cannot determine the cause of the problem.
If you have any ideas on how to identify the problem, please let me know.
http://fullcalendar.io/docs/event_data/removeEvents/
removeEvent only specifies the id of the event.
The rails code is that when you click on an event in the calendar, the form will appear in the jQueryUI dialog, from which you can edit and delete it.
Deleting is a normal link.
Form
<%=link_toll(:link_to_ttevent_destroy), ttevent_path(@ttevent), method::delete,
data: {confirm:l(:message_destroy_confirm)}, remote:true,
class: 'button destroy'%>
Controller
def destroy
id=params[:id]
@ttevent=Ttevent.find(id)
@ttevent.destroy
response_to do | format |
format.js
end
end
View (destroy.js.coffee)
The fullCalendar does not emit any errors, and JavaScript runs to the end to rewrite the list.
$('#dialog').dialog('close')
$('#modal_area') .html('')
id=<%[email protected]%>
$('#fullcalendar') .fullCalendar('removeEvents',id)
$.ajax
type: 'GET'
url: "ttevents/issue_lists"
Incidentally, the FullCalendar drag-and-drop code is as follows.
When the event div written below is dragged and dropped into the calendar, an 'eventReceive' event occurs. Then, create an Event object from the div data attribute.
POST it to rails at $.ajax.
Then, rails will return the data with id and automatically calculate and return the color of the event.
Now update the original Event object.
The color changes, and you can edit the event by clicking on it, so I think it's going well so far.
eventReceive: function(event, element){
title=event.title;
start = event.start.format();
end = event.end.format();
issue_id = event.issue_id;
stick = event.stick;
$.ajax({
type: "POST",
url: "ttevents",
data: {
ttevent: {
start_time —start,
end_time —end,
issue_id —Issue_id
}},
success:function(ttevent, status){
event.color=ttevent.color;
event.id = ttevent.id;
$('#fullcalendar') .fullCalendar('updateEvent', event);
$.ajax({
type: 'GET',
url: "ttevents/issue_lists"
})
}
});
},
View events for drag-and-drop
<div class="draggable tt-event boxui-draggable-disabled<%=set_due_date(issue)%>"
data-duration="00:30"
data-issue_id='<%=issue.id%>'
>
<%=issue.project.name%>-<%=issue.subject%>
</div>
Perhaps the destroy.js.coffee is working in other cases, so there will be no mistake as a destroy function.
I thought the id might be a different type such as String or Number, so I put out a typeof in console.log, but they all seemed to be numbers.
Even if it's a freshly made event, the color will change, so I think the update is done well. In other words, the event seems to have a valid id.
Also, once I edited it, I could delete it without reloading it.
success:function(ttevent, status){
event.color=ttevent.color;
event.id = ttevent.id;
$('#fullcalendar') .fullCalendar('updateEvent', event);
$.ajax({
type: 'GET',
url: "ttevents/issue_lists"
})
}
Please check if the ttevent.id
in this code contains a valid value.
The behavior you want to delete with the event.ID
specification has been verified, and the ID
is not configured on the event side that the fullcalendar
has.
© 2024 OneMinuteCode. All rights reserved.