My favorites
▼
|
Sign in
fullcalendar
ISSUE TRACKER HAS MOVED. DO NOT USE THIS (more info)
Project Home
Issues
Export to GitHub
New issue
Search
Search within:
All issues
Open issues
New issues
Issues to verify
for
Advanced search
Search tips
Subscriptions
Issue
162
attachment: example.html
(3.0 KB)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
<h1>Agenda</h1>
<script type="text/javascript">
$(document).ready(function() {
var date = new Date();
var d = date.getDate();
var m = date.getMonth();
var y = date.getFullYear();
/*
TODO:
====
- Make past appointments uneditable, undraggable, unmovable
- Make the events multicolored
- Make the events editable
- Add events via modal dialog
*/
$("#calendar").fullCalendar({
defaultView: "agendaWeek",
weekends: false,
minTime: 8,
maxTime: 21,
height: 620,
header: {
left: "prev,next today",
center: "title",
right: "month,agendaWeek,agendaDay"
},
editable: true,
events: "/appointments",
allDaySlot: false,
allDayDefault: false,
dayClick: function(dayDate, allDay, jsEvent, view){
if (view.name != "month"){
// Reset the form
// Set the start date for the new event
$("#appointment-startsAt").val(dayDate);
// Reveal the dialog
$("#event-form").dialog("open");
}
},
eventClick: function(calEvent, jsEvent, view) {
// Set the data into the form
// Change the form action URL to an update URL
// Reveal the dialog
$("#event-form").dialog("open");
},
eventDrop: function(calEvent, dayDelta, minuteDelta, allDay, revertFunc, jsEvent, ui, view) {
// update the event with the new data
},
eventResize: function(calEvent, dayDelta, minuteDelta, revertFunc, jsEvent, ui, view) {
// update the event with the new data
},
});
// Setup the dialog
$("#event-form").dialog({
title: "New appointment", autoOpen: false, resizable: false, width: 480, height: 350, modal: true
});
// Setup autocomplete for patients
$("#appointment-patient").autocomplete("/patients/search");
// Assigned the selected patient
$("#appointment-patient").result(function(event, data, formatted) {
$("#appointment-patientId").val(data[1]);
});
// Limit the notes
$('#appointment-notes').limit('255');
});
function onSubmitSuccess(data, textStatus){
$("#calendar").fullCalendar("refetchEvents");
$("#event-form").dialog("close");
}
function onSubmitError(XMLHttpRequest, textStatus, errorThrown){
alert("Oops, an error occured. Please verify your data and try again");
}
</script>
<div id="calendar"></div>
<div id="event-form" class="hidden">
<cfoutput>
#startRemoteFormTag(controller="appointments", action="create")#
<p><label class="required inlined">Enter the patient name or UID</label>
#textFieldTag(name="appointment[patient]", class="input-text")#</p>
<p><label for="appointment-doctorId">Doctor</label>
#selectTag(name="appointment[doctorId]", options=doctors, textField="fullName")#</p>
<p><label class="required inlined">Additional notes</label>
#textAreaTag(name="appointment[notes]", class="input-text")#</p>
#hiddenFieldTag(name="appointment[patientId]")#
#hiddenFieldTag(name="appointment[startsAt]")#
#submitTag(class="g-button")# or <a href="##" onclick="$('##event-form').dialog('close');">Cancel</a>
#endRemoteFormTag()#
</cfoutput>
</div>
Powered by
Google Project Hosting