I must set timeFormat, axisFormat (HH:mm) called from within a 'ready' block!
I read a article from http://www.learningjquery.com/2007/10/a-plugin-development-pattern.
And maybe I'm wrong, but I think the only way to set parameters for fullcalendar is to pass it by 'constructor' - I mean:
jQuery('#calendar').fullCalendar({
events: [
{
title: 'My Event',
start: '2010-06-08T14:30:00',
end: '2010-06-08T15:45:00',
allDay: false
}
// other events here...
],
defaultView: 'agendaDay',
timeFormat : {
"" : "H:mm{ - H:mm}",
agenda : "H:mm{ - H:mm}"
},
axisFormat : "H:mm"
});
But I really need to set those(timeFormat, axisFormat) properties after object initialization...
Is it an implementation bug that those properties cann't be overwritten after?
*I'm using seam, primefaces(with fullcalendar.js). I really don't know is there any other solution... help :)
there is actually an undocumented function for this. use
$.fullCalendar.setDefaults({
// your options here
});
i can't guarantee the api won't change in the future though. since this is unofficial, i cant help you beyond this. good luck
Related
How do I add and then access additional values My_Custom_Value to the Event Object?
events: [
{
title: 'My Title',
My_Custom_Value: 'some details',
allDay: false,
start: 1501056000000,
end: 1501057800000
}
],
Access your value through "extendedProps":
A plain object holding miscellaneous other properties specified during parsing. Receives properties in the explicitly given extendedProps hash as well as other non-standard properties."
https://fullcalendar.io/docs/event-object
eventRender: function(info){
console.log("_______ info _______\n");
console.log(info.event.extendedProps.My_Custom_Value);
}
Use extendedProps. You can include them in the event object directly (https://fullcalendar.io/docs/event-object), or add them afterwards using method Calendar::setExtendedProp (https://fullcalendar.io/docs/Event-setExtendedProp)
events: [
{
title: 'My Title',
My_Custom_Value: 'some details',
allDay: false,
start: 1501056000000,
end: 1501057800000
extendedProps: {
description: 'whatever',
madeupProperty: 'banana'
}
}
]
The answer to this is contained in the Event Parsing documentation at https://fullcalendar.io/docs/event-parsing.
The way you're setting the custom property in your object is fine. As per that documentation, fullCalendar will read it, and then place it in the extendedProps property of the event object it creates internally.
So if you then need come to access that event later (e.g. via one of fullCalendar's callbacks such as eventClick, perhaps) you would use event.extendedProps.My_Custom_Value to access it.
In "FullCalendar" I could add an event using "addEventSource" by array manually, however, I could not succeed adding the event through Google Calendar ID.
$('#calendar').fullCalendar("addEventSource",{
events: [
{
title : 'event1',
start : '2019-02-01'
}
]
});
THE BELOW SNIPPET NOT GETTING THROUGH. PLS ASSIST
$('#calendar').fullCalendar("addEventSource",{
events: {
googleCalendarId: 'abcd1234#group.calendar.google.com',
}
});
FYI by FUllcalendar: Source may be an Array/URL/Function just as in the events option. Events will be immediately fetched from this source and placed on the calendar.
Firstly please ensure you followed all the steps in the documentation (https://fullcalendar.io/docs/google-calendar) beforehand otherwise it won't work.
Secondly, your object structure is wrong. The events wrapper should not be there when specifying an event source. Perhaps you confused the events option in fullCalendar as being part of the structure required for an event source object, which is documented here: https://fullcalendar.io/docs/event-source-object
Specifically it documents the structure for a google calendar to be the source:
{
googleCalendarId: 'abcd1234#group.calendar.google.com',
color: 'yellow', // an option!
textColor: 'black' // an option!
}
So I suggest you change your code as follows, to match the documented object structure. Basically you just remove the erroneous events bit:
$('#calendar').fullCalendar("addEventSource", {
googleCalendarId: 'abcd1234#group.calendar.google.com',
});
I'm using Fullcalendar 2.3.1. I'm trying to convert the time (for example 13:00-14:00) in the month view into 12hr format. Here is my current timeFormat option value:
timeFormat: 'h(:mm)t'
and some example event json:
{
id: "40163152543",
original_id: "3231",
title: "Conference Call",
description: "",
start: "2015-11-20T13:00:00",
end: "2015-11-20T14:00:00",
allDay: false,
color: ""
}
In Week and Day views I am seeing 1p-2p, which is what I want, but in month view I am still seeing 13:00-14:00. Same issue in v 2.6.0! Is this a bug??
It should work. I tried it locally and works fine as per your configuration.
But still you face same issue then try by giving view specific option. May this will solve.
So in the extension library I'm using there was an eventRender callback that I was missing that was overriding the timeFormat option. This is the working override if curious:
eventRender:
function(event, element, view)
{
if(event.end !== null && view.name == 'month')
{
timeformat = event.start.format('h(:mm)t') + ' - ' + event.end.format('h(:mm)t');
element.find('.fc-time').html(timeformat);
}
}
If you have this issue, lookout for an eventRender callback! More documentation on it here: http://fullcalendar.io/docs/event_rendering/eventRender/
Very useful callback, also cool way to do view-specific options, especially with the default view, and #ChintanMirani answer was great too!
My view contains a sap.m.SearchField.
How can I invoke the search in that field? The usual trigger("tap") approach does not seem to work.
After some debugging I found out that a combination of the pseudo events saptouchstart and saptouchend triggered in the magnifying glass icon within the search field works.
return this.waitFor({
id: "mySearchField",
viewName: sViewName,
success: function (control) {
var event, searchIcon;
event = jQuery.Event( "saptouchend" );
event.originalEvent = event; // would otherwise cause NPE at some point in SAP code
searchIcon = control.$().find("div[id*=mySearchField-search]");
searchIcon.trigger("saptouchstart").trigger(event);
},
errorMessage: "Search field not found"
});
This can also be done with the following one-liner (source):
$(theSearchField).trigger("onSearch");
But maybe this is only possible with a more recent version of UI5 than the one used by you.
Another solution approach would be to use an EnterText action, which not only enters the search term ("foobar" in the following example), but also triggers the search afterwards:
this.waitFor({
id: "mySearchField",
actions: [ new sap.ui.test.actions.EnterText({ text: "foobar" }) ]
});
I am using TextExtJs for an autocomplete feature where you start typing and the dropdown of suggestions appears below the text input and you can select a suggested option with arrow keys or mouse.
Everything is working great except that I am trying to perform a function after the user selects one of the suggestions. There is a hideDropdown event which I think is the proper event to use for this. Unfortunately I'm not understanding how to do this, this is what I have tried:
$('#usearch').textext({
plugins : 'autocomplete ajax',
ajax : {
url : 'usersuggest.php',
dataType : 'json',
cacheResults : true
},
autocomplete : {
onHideDropdown : function(){
alert('A happened');
},
hideDropdown : function(){
alert('B happened');
}
},
onHideDropdown : function(){
alert('C happened');
},
hideDropdown : function(){
alert('D happened');
}
});
None of these functions with the alert actually ever run. They do not interfere with the suggestion piece of it. How do I attach a callback to this event?
I'm facing the same problem here....
Unfortunately there is no proper solution. The manual is as rudimental as the examples provided on the plugin page.
I managed to bind a kind of "onAddingTag" event, refer to this: http://textextjs.com/manual/plugins/tags.html#istagallowed
$('#textarea').textext().bind('isTagAllowed', function(e, data) {
var valueAdded = data.tag;
data.result = true; //needs to be done, since we're abusing this event
};
Despite the fact that this may help with this issue, your next problem would be: when does the user remove a tag?
Finally I ended up, using another autocomplete library.