I need to change the minTime property of agendaDay dinamically when the user changes the date. I've tryed this:
dayRender: function(event, element, view) {
$('#calendar').fullCalendar('getView').calendar.options.minTime = '10:35:00';
//$('#calendar').fullCalendar('render');
}
The value '10:35:00' is only an example, because my application brings the real values from database according the selected date. When I uncomment the line $('#calendar').fullCalendar('render'); the page becomes white in consequence of an error, I think.I've tried also $('#calendar').fullCalendar('destroy'); with no results, and the same error appears.
What is the correct manner to refresh the view when the user changes the date?
After initialization is complete, you can only change 'contentHeight','height','aspectRatio',so you must destroy the calendar then rebuild
Related
I was building a Calendar with dynamic events.
Simplest representation of my event object
id : " sdsddsd "
start : "2018-05-13T0..."
end : "2018-05-26T0"
open_monday: true
open_tuesday: false
open_wednesday: true
open_thursday: false
...
So in the month view calendar, I wanted to show my events and within the event if open_monday is true then set the background of that day grid to green. The following Tuesday will use the value open_tuesday and it is false so it will display red.
The red and green background will only be inside an Event. If the day grid isn't within any event, it will be left as blank.
How can I do this. Or is there a better way to do this using resources, constraintsetc. ?.
Thanks.
I am not sure I understand, but it is rather strange to pass the whole list of open/closed weekdays with each event. You should rather determine which weekday your event is and act accordingly. Just add an eventRender callback field to your calendar to control exactly the layout of the HTML element rendering the event. See
https://fullcalendar.io/docs/eventRender
To know the weekday of an event, use
moment(event.start).day()
See
https://momentjs.com/docs/#/get-set/day/
Alternatively, you can add an eventDataTransform field to your calendar, which will be applied to each event when it is loaded, so you can change any of its layout specifiers (color, backgroundColor, className...), see list at
https://fullcalendar.io/docs/event-object
when I am clicking first time on filter
s.eVar55 showing value as 'undefined'
however when I am calling my data element which is _satellite.getVar("payal evar55/prop55 test")
I am getting the correct value
this data element has been mapped to s.eVar55
Please see the attached screenshot
but s.eVar55 is not showing value when first time filter click happened
but from second time onwards it shows the previous value
"Code which i have written in adobe DTM custom editor"
if(_satellite.getVar("payal evar55/prop55 test") && _satellite.getVar("payal evar55/prop55 test") !== null){
s.linkTrackVars='eVar55,prop55';
s.eVar55=_satellite.getVar("payal evar55/prop55 test");
s.prop55=_satellite.getVar("payal evar55/prop55 test");
}
You aren't giving enough information to be sure what you're trying to do, but I assume you've set up a data element and you're trying to use it to store the filters that you've clicked. The fact that you're always one step behind is telling me that your load order is what is causing the issue.
The data element is trying to set when the page refreshes but your rule is firing on the click, so its blank the first time and one behind after that.
Personally, I would just set the prop and eVar on the click rule, if you need the data element for some reason, you can set that in the click rule as well:_satellite.setVar("Element Name",value);
If you want help setting the values in the click rule, you'll need to give more information and I will update my answer. If the filter value is in an attribute of the target of your click rule, you can use this.getAttribute('your attr name'), and if it is simply a text value, you can use %this.#text% in the UI to get your desired value.
I created a demo to show the issue I am having using a jQuery library called Zebra-Datepicker.
Zebra-Datepicker documentation: http://stefangabos.ro/jquery/zebra-datepicker/
Zebra-Datepicker GitHub: https://github.com/stefangabos/Zebra_Datepicker
My demo shows how to:
create a DatePicker instance,
select a date value,
destroy the date picker instance,
create a new instance of the date picker,
select a new date value....
Problem:
The problem is that destroying the DatePicker does not seem to destroy the previous selected date value! So when instantiating a new DatePicker, it has the previous Date value selected instead of a new value!
I could really use some expert help as this is crucial for me to fix for my project which loads Project Task records into a Modal DIV. My Task records all share the HTML in the DOM of a single Modal, just replacing placeholder variables for a Task and then re-setting them when Modal is closed for the next Task to do the process over and over.
My Demo JSFiddle: http://jsfiddle.net/jasondavis/Lqwfamoc/17/
If you follow these steps on my demo you will see what I mean...
Click on Date SPAN to reveal DatePicker calendar and click on date 2015-05-30
Click Destroy DatePicker button
Click on Date Span which will then show DatePicker is missing since we destroyed it.
Now click on UPDATE DatePicker to 2015-05-24 Button which will set the Date SPAN value to have a new date of 2015-05-24. When we instantiate the DatePicker plugin again, it should grab this new date value in the SPAN and set the DatePicker to this date!
Now click Build New DatePicker button which instantiates a new DatePicker
Now click the Date SPAN text: 2015-05-24 to show the DatePicker Calendar again
You should now see that the original 30th day 2015-05-30 is selected in the DatePicker even though it SHOULD now have our Date value of 2015-05-24 selected instead since we destroy() and re-instantiated a new DatePicker after Destroying the old one!
Apparently, the Destroy method didn't full destroy or something else is going on? Any ideas on how to fix this?
The sourcecode of the actual Zebra-Datepicker lIbrary's destroy() method:
Located here
https://github.com/stefangabos/Zebra_Datepicker/blob/master/public/javascript/zebra_datepicker.src.js#L1469
/**
* Destroys the date picker.
*
* #return void
*/
plugin.destroy = function() {
// remove the attached icon (if it exists)...
if (undefined !== plugin.icon) plugin.icon.remove();
// ...and the calendar
plugin.datepicker.remove();
// remove associated event handlers from the document
$(document).unbind('keyup.Zebra_DatePicker_' + uniqueid);
$(document).unbind('mousedown.Zebra_DatePicker_' + uniqueid);
$(window).unbind('resize.Zebra_DatePicker_' + uniqueid);
// remove association with the element
$element.removeData('Zebra_DatePicker');
};
I found the problem. You need to change this:
$('#updateDate').on('click', function(){
$('#task-modal-due-date-span').text('2015-05-24');
});
to this:
$('#updateDate').on('click', function(){
$('#task-modal-due-date-span').text('2015-05-24').val('2015-05-24');
});
The reason is that when you rebuild a new DatePicker control, it is looking at the value of the span, not the text of the span. (Note: Normally you would attach a DatePicker to an "input" element, not a "span" element.)
So what I am trying to accomplish is what most Hotel or Airport sites have in general, after you've chosen a date for your arrival when clicking on the next calendar it automatically updates the calendar dates to the same month in which you chose your arrival.
See: http://hotelsaxchicago.com
I currently have jQuery UI and it's calendar plugin for a casino/hotel site: http://staging.comanchenationcasinos.com
Is there away to do something similar on here? How can I detect what's already in the input field without actually clicking the submit button.
At the same time, how can I trigger the calendar if someone clicks on the icon instead?
Thanks ahead of time.
What I usually do for the calendar link next to the input is something like
$('body').on('click', '.calendar_icon', function(){
$(this).prev('input[type="text"]').focus();
return false;
});
That will drop the focus onto the text input sitting previously in the markup.
Regarding the date resetting, try something like this:
Assuming you have the first input with the id of first_date and the second as second_date...
$('body').on('change', '#first_date', function(){
var this_date = $(this).val();
$('#second_date').datepicker("setDate", new Date(this_date) );
});
Worth noting, you could also attach the two date pickers with data-next-datepicker="#something" to make it really specific if you'd rather not use #second_date. I'd go that route if you had a series of dates on the page.
I am using Bootstrap Date Range Picker and I am trying to enable a second click on the same date range.
Ex: User clicks on "today" and gets results, then clicks again 5 minutes after and gets the updated results.
Everything works fine on the first click but due to line 298 .on('click', 'li', $.proxy(this.clickRange, this)) the click gets unbound on that item.
I looked everywhere to try and correct it to no avail.
The callback is only fired when a new date range is selected.
If you'd like to change the behavior, this is the line to change.