jonthornton/Datepair.js

Not scrolling to selected time when initially set using VAL(jquery)

Closed this issue · 3 comments

Hi
I am using fullcalendar.js where on select of day it loads MODAL POP UP(bootstrap) which has date and times set initially(times being set to now and now+1 hr in start and end resp.)
Problem is when I click on start time first ,dropdown takes me to the value selected(in my case NOW).
When I move to end time and come back to start,it's not jumping to the selected time.

So I tried in fiddle http://jsfiddle.net/avinashramireddy24/atccm35c/5/ and it's working fine there.

Also I am not using jquery-datepair.js
I am just using datepair with bootstrap datepicker and jquery timepicker .
PFA
screenshot 84

Is this some design issue I am not able to find or something else?

Hi,
If you see my fiddle in above comments,I was passing initial value on loading of datepair.
I think something has to do with the VAL.
So I tweaked script file a bit and found that in
jquery-timepicker file near the lines of


 if (!selected.length) {
                var timeInt = _time2int(_getTimeValue(self));
              ---------some code here---------
            }

            if (selected && selected.length) {

              //var topOffset = list.scrollTop() + selected.position().top - selected.outerHeight();
                var topOffset = 0 + selected.position().top - selected.outerHeight();


                list.scrollTop(topOffset);
            }
            //else {
            //    list.scrollTop(0);
            //}

 // prevent scroll propagation
 if (settings.stopScrollPropagation) {
                $(document).on('wheel.ui-timepicker', '.ui-timepicker-wrapper', function (e) {
                    e.preventDefault();
                    var currentScroll = $(this).scrollTop();
                    $(this).scrollTop(currentScroll + e.originalEvent.deltaY);
                });
            }

As you can see I set list.scrollTop() to 0

          //var topOffset = list.scrollTop() + selected.position().top - selected.outerHeight();
            var topOffset = 0 + selected.position().top - selected.outerHeight();

because when I first click on start time it takes some height(let's say 1943)
then when I click on it second time it is calculating based on this value(means 1943+b-c).
Since I have max of let's say 2500 it is moving to last item position.

Only problem I am facing now is end time value not selected on loading because of regex matching pattern(only on LOADING).Later when we change start time ,end time is selected.

__time2int(timeString, settings)_ does not match any value of end time.So it's returning null.

My time picker settings have *timeFormat: 'G:i',

I am still finding to match pattern.
BTW I am using jquery-timepicker v1.11.1 version(which I don't think any changes are made regarding this selected feature.I tried in other versions also)
Please share your thoughts on this....

I'm sorry but I don't understand the question. Try posting a fiddle of what's broken.

1.Please select the end time from the link http://jsfiddle.net/avinashramireddy24/atccm35c/5/ when it first loads .As you can see it's not highlighting the end-time.

2.I had same problem with start time in my machine but not in fiddle.
Using above solution near the lines of

//var topOffset = list.scrollTop() + selected.position().top - selected.outerHeight();
            var topOffset = 0 + selected.position().top - selected.outerHeight();

fixed start time (local)

3.But this does not trigger highlight of end-time.

4.All this is happening because of using VAL I guess. When I change start time it is correctly highlighting end-time. Only when set using VAL first time I am facing this kind of problems