search envelope-o feed check
Home Unanswered Active Tags New Question
user comment-o

How to prevent the changed between dates when we implemented Rowfilter and Scrolling.

Asked by Arturo Villalpando
13 days ago.

Hi everybody,

I have a trouble with the plugin, and I don't know how to fix it. I implemented Infinite Scrolliing and RowFilter, the problem ocurrs when I filtered the Scheduler and the dates moved. I had a problem similar with Infinite Scrolling and Zoom, in that case I solved with set the date in onScroll function, but this time doesn't work. can you help me with this please.

I had another problem when I reload the webpage, the events load two times or three, like the scroll moved, and i dont know why.

I include the code attachment, thanks in advanced.

Answer posted by Dan Letecky [DayPilot]
4 days ago.

When infinite scrolling is enabled, it is necessary to be careful when changing the Scheduler timeline parameters (scale, cellWidth, startDate and especially days).

The infinite scrolling feature shifts the timeline whenever the the scrollbar is near the start or end of the current timeline. If the timeline is too short, it may switch back and forth indefinitely or scroll away to a different date. You should keep the timeline length greater than 3 times the viewport width.

Resetting the startDate in onScroll mentioned here is not a good idea - it will break things:

Generally, you shouldn't modify the Scheduler properties in onScroll, see also:

The same applies when setting the initial Scheduler parameters. If you use the default scrollbar position during initialization, it will immediately shift the timeline after calling init(). You should scroll away from the startDate before calling init() - use scrollTo() method:

When using zoom, you may need to use different the infinite scrolling properties for different zoom levels:

Comment posted by Arturo Villalpando
1 day ago.

The problem with the scroll still go on, even i tried to implement a basic configuration, but doesn't work. Also i tried to take the example code from the infinite demo and doesn't work too.

Always that i tried this change, I set startDate = "2018-01-01"; when i run the website the month moves one month backward (Dec 2017), even if I add at the end dp.scrollTo("2018-01-01"); the month moves another month backward (Nov 2017).

When I ran the demo from the scheduler folder works well and i don know why, but when i took the script code and put that in a example like below doesn't works. For this test I alway used a simple website, with the javascript code that is below or I took the demo code, both works similar:

<!DOCTYPE html>
<title>DayPilot Pro for JavaScript</title>
<!-- head -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- helper libraries -->
<script src="jquery-1.12.2.min.js" type="text/javascript"></script>
<!-- daypilot libraries -->
<script src="daypilot-all.min.js" type="text/javascript"></script>
<div id="dp"></div>
<script type="text/javascript">
var dp = new DayPilot.Scheduler("dp");
dp.startDate = "2018-01-01";
dp.days = 365;
dp.scale = "Day";
dp.timeHeaders = [
{ groupBy: "Month", format: "MMM yyyy" },
{ groupBy: "Cell", format: "ddd d" }
dp.scrollDelayEvents = 0;
dp.infiniteScrollingEnabled = true;
dp.onScroll = function(args) {
dp.dynamicLoading = true;

New Reply
This reply is
Your name (optional):