55 lines
1.5 KiB
Plaintext
55 lines
1.5 KiB
Plaintext
|
|
||
|
|
eventClick
|
||
|
|
==========
|
||
|
|
|
||
|
|
Triggered when the user clicks an event.
|
||
|
|
|
||
|
|
<div class='spec' markdown='1'>
|
||
|
|
function( *calEvent*, *jsEvent*, *view* ) { }
|
||
|
|
</div>
|
||
|
|
|
||
|
|
`calEvent` is an [Event Object](../event_data/Event_Object) that holds the event's information (date, title, etc).
|
||
|
|
|
||
|
|
`jsEvent` holds the native JavaScript event with low-level information such as click coordinates.
|
||
|
|
|
||
|
|
`view` holds the current [View Object](../views/View_Object).
|
||
|
|
|
||
|
|
Within the callback function, `this` is set to the event's `<div>` element.
|
||
|
|
|
||
|
|
Here is an example demonstrating all these variables:
|
||
|
|
|
||
|
|
$('#calendar').fullCalendar({
|
||
|
|
eventClick: function(calEvent, jsEvent, view) {
|
||
|
|
|
||
|
|
alert('Event: ' + calEvent.title);
|
||
|
|
alert('Coordinates: ' + jsEvent.pageX + ',' + jsEvent.pageY);
|
||
|
|
alert('View: ' + view.name);
|
||
|
|
|
||
|
|
// change the text color of the event
|
||
|
|
$(this).css('color', 'red');
|
||
|
|
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
|
||
|
|
Return Value
|
||
|
|
------------
|
||
|
|
|
||
|
|
Normally, if the [Event Object](../event_data/Event_Object) has its `url` property set, a click on the event
|
||
|
|
will cause the browser to visit the event's url (in the same window/tab).
|
||
|
|
Returning `false` from within your function will prevent this from happening.
|
||
|
|
|
||
|
|
Often developers want an event's `url` to open in a different tab or a popup window.
|
||
|
|
The following example shows how to do this:
|
||
|
|
|
||
|
|
$('#calendar').fullCalendar({
|
||
|
|
eventClick: function(calEvent, jsEvent, view) {
|
||
|
|
if (calEvent.url) {
|
||
|
|
window.open(calEvent.url);
|
||
|
|
return false;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
The `window.open` function can take [many other options](http://www.w3schools.com/jsref/met_win_open.asp).
|