Selecting Previous Hour #76

Open
jkardong opened this Issue Jun 20, 2016 · 13 comments

Projects

None yet

3 participants

@jkardong

Say I have set the time to "5:30 PM". I don't see how you can select "5:00", only times moving forward.

Can I have this in the dropdown?

etc..
4:00
4:30
5:00
5:30 (SET TIME)
6:00
6:30
7:00
etc..

@wvega
Owner
wvega commented Jun 21, 2016

Try setting the dynamic option to false:

$('.timepicker').timepicker({
    // your other options
    dynamic: false
});

Does that work?

@wvega wvega added the question label Jun 21, 2016
@wvega wvega self-assigned this Jun 21, 2016
@wvega wvega added this to the Support milestone Jun 21, 2016
@jkardong

Thanks, but no, unfortunately that doesn't work.

@wvega
Owner
wvega commented Jun 21, 2016

Can you share your initialisation code here? A screenshot of what you are seeing would also help. If you can put a working example of your problem on http://jsfiddle.net, that would be great as well. You can use this fiddle as a starting point: http://jsfiddle.net/wvega/05kk6s1w/.

@jkardong

Not much to it really

            $('#time-chooser').timepicker({
                timeFormat: 'h:mm:ss p',
                interval: 1,
                startHour: '1:00am',
                defaultTime: '10:30 PM',
                startTime: '10:30 PM',
                dynamic: false,
                dropdown: true,
                scrollbar: true
            });
@wvega
Owner
wvega commented Jun 22, 2016 edited

This is what I see in http://jsfiddle.net/wvega/05kk6s1w/ using your initialisation code:

jquery_timepicker_basic_demo_-_jsfiddle

I think the time entries in the screenshot shows your desired behaviour from the description of this issue. Time entries occurring both before and after the selected time are being shown.

  • Is that the behaviour you want?
  • How is that different from what you are seeing in your project (screenshot please)?
@jkardong

So, it's close, but I need to be able to scroll backwards as well. So if the current time is 10:30, I need to see 10:29, 10:28, 10:27 and such. I'm not sure if this can be done with the tool or not?

time

@wvega
Owner
wvega commented Jun 24, 2016 edited

The problem I see, is that you set the startTime option to '10:30:00 PM' in the configuration, so that's going to be the first value you see.

You also defined startHour, but when both startTime and startHour are defined, only startTime is considered.

What were you trying to achieve with those two options?

@jkardong

Thanks @wvega

The 10:30 was just an example, prob should have been new Date() or a MomentJS type of variant where it gets the current time.

I set startHour and startTime simply because that's what was in the example online, so replicated it. I just removed everything but startTime and not doing what I want. Here is updated code

        $('#time-chooser').timepicker({
            timeFormat: 'h:mm:ss p',
            interval: 1,
            startTime: moment().format("HH:mm:ss"),
            dynamic: false,
            dropdown: true,
            scrollbar: true
        });

Seems so very strange to me you are unable to scroll to a previous time. Seems like you can do it, I just can't figure this out.

@wvega
Owner
wvega commented Jun 24, 2016

The time entries in the dropdown have a beginning and an end. You should be able to scroll back and forward within those beginning and end. However, if you select the first time entry, you can't scroll to a previous time anymore, and if you select the last time entry, you can't scroll to a future time.

The first time entry in the dropdown can be configured with the startTime setting. The rest of the time entries will be generated based on that setting, taking into account the value of the minTime and maxTime settings, that constraint the allowed values.

If you set startTime to 10:30pm, interval to one minute and define no value for minTime and maxTime, then the first time entry will be 10:30pm and the following entries will go from 10:31pm to 11:59pm, followed by the time entries between 12:00am and 10:29pm (one minute before the startTime).

@wvega
Owner
wvega commented Jun 24, 2016

@jkardong Let's say I'm using your application and I'm about to pick a value for the field that is using the timepicker. This is my first interaction with that field. The following questions may help me to understand what settings you need for your particular case:

  1. Does the field have a default value? or is it empty?
  2. When I click on the field, or move focus to the field, what do you want to be the first time entry in the dropdown?

Now I picked one of the available options (choose a value, any, just to continue the example), but decided I need to change the value, so I move focus back to the field, or click on it again:

  1. What should be the first time entry in the dropdown this time?
    1. The one you set in startTime?
    2. The next allowed value (one minute after the selected value)?
    3. The selected value?
@jkardong
  1. There is a default time

  2. First time entry should be the time that is set in #1

  3. i. The selected value

This might help. I'll describe what I'm trying to use this with. This is a Scheduling Application allowing users to select a time they want to come in.

  1. User has an assigned time for an appointment.
  2. Assigned time is saved in a database
  3. User logs into system and pulls up their appointment
  4. Decides they want to come ten minutes earlier
  5. Selects time and sets the time
  6. Saves
@wvega
Owner
wvega commented Jun 24, 2016 edited

Try using the defaultTime option to pass the value stored in the database to the timepicker's configuration. Drop the startTime option and keep dynamic set to false. That should get you very close to the desired behaviour. Does it?


I noticed two bugs in the current version that need to be fixed and may be affecting your experience:

  1. The timepicker should use the value from HTML value attribute of the input field as the default time. Surprisingly, it doesn't do that automatically.

  2. When you use the defaultTime option and open the dropdown of time entries for the first time, the selected value is not being shown automatically, so you have to scroll to find it.

    If you want to pick a value that is just 10 minutes before the currently selected value, it would be a lot better if the plugin automatically scroll the time entries to show the selected value and the values around it.

    This used to work fine in a previous version. I'll figure out when it broke and will release a fix soon.

@wvega wvega added the needs docs label Jun 24, 2016
@aidanayalacb

Any ETA on this?

I also require to be able to select previous times and times in the future.

And for the scroll to be defaulted on the default time.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment