🗓 [FREE Plugin] Air Date/Time Picker

veshoe23 · September 19, 2017, 6:14pm

@seanhoots “placeholder option” would give the plugins a different edge what i could test run and realize … basic to advance

Please look into it…

romanmg · September 27, 2017, 8:03pm

+1 for placeholder and +1 for ability to reset

jarrad · September 28, 2017, 8:57am

Hey guys, This sounds like one of those he gave me this code moments,

Grab the PlugBubble Plugin.
Expose & Assign an ID to your Picker.

then,

To add the placeholder, on page load run this block:

var placeholderHere = "YOUR-PLACEHOLDER";
    var pickersId = "PICKER-ID";

    var hunt4; 
    hunt4 = $('#'+pickersId).find('input'); 
    var lilSuckersID; 
    lilSuckersID = hunt4.attr('id'); 
    $('#'+lilSuckersID).val(placeholderHere);

To Reset Use the Run Custom Code Block action with this block:

var valueAfterReset = "YOUR-PLACEHOLDER";
var pickersId = "PICKERS-ID";


var findHim; 
findHim = $('#'+pickersId).find('input'); 
var askHim; 
askHim = findHim.attr('id'); 
var resetHim;
resetHim = $('#'+askHim).datepicker().data('datepicker');
resetHim.clear();
$('#'+askHim).val(valueAfterReset);

starnapp · November 6, 2017, 5:20pm

Does anyone have this time picker working inside a reusable element?

For me, it is working on the main page but not inside reusable elements. Any ideas?

Thanks,

Jici · November 19, 2017, 4:57pm

Is it possible to reset value of picker? I’m trying to use the reset group data but doesn’t seem to work. Thanks.

thefiend · November 21, 2017, 10:35am

Hi, is it possible to select more than one Time for a particular date in Multiselector?
Appreciate if someone is able to help with this.

ben.nes · November 22, 2017, 9:39am

Time selector is too small for users using touch screen. Is there ways to increase it’s size?

janheinemeyer1 · December 3, 2017, 7:35pm

I wanted to disable the picker for certain users, but whenever i add that as conditional state it is disabled forever and i don’t know how to enable it again. I thought it’d work like the disable/enable functionality of standard inputs. Can you elaborate on that feature?

seanhoots · December 4, 2017, 2:00am

Hey guys, sorry for not being around for some time. Had to hibernate from online to attend to some personal matters.
I’m back now.
I’ve read all the questions and feature requests and will try to respond to most.
First off based on comments on this thread and messages i received below are the most requested new features.

Autobinding
Placeholder
Reset picker
Multiple initial dates (not only date range)

I’ve implemented 2,3,4 and left with only the autobiding.
The issue for me with the autobinding is that i’m not sure whether i should implement it for single dates or list of dates.
The plugin-editor requires you to specify whether the field to bind to is a single value or a list. And since the Air Date Time picker allows both i will have to choose one of them.
I might have to here from you guys which one you prefer.
Alternatively i’m thinking of breaking the plugin into two separate elements; one for only single dates and the other for multiple dates. This way i can implement the autobinding for both.

seanhoots · December 4, 2017, 2:27am

Plugin page: Air Date/Time Picker

Updates - Version 2.3
(1) Added ability to set placeholder
You can enter a placeholder text to be displayed when not date/time has been selected.
If you do not enter any text, by default placeholder which is the current date/time will be displayed.
In this case the format for the placeholder will be the same format you choose in the property editor

(2) Added ability to set multiple initial dates
Previously you could only set a range of date as initial content.
With this update you can set a list of dates as initial content. The dates don’t need to be a range.
multiple dates

(3) Added a reset element action
You can use a reset action for the date/time picker to reset the element to the initial content.

Happy bubbling

seanhoots · December 4, 2017, 2:30am

See latest update

seanhoots · December 4, 2017, 2:42am

jarrad:

var placeholderHere = “YOUR-PLACEHOLDER”;
var pickersId = “PICKER-ID”;
var hunt4; 
hunt4 = $('#'+pickersId).find('input'); 
var lilSuckersID; 
lilSuckersID = hunt4.attr('id'); 
$('#'+lilSuckersID).val(placeholderHere);

Hi @jarrad this will not really work. Here you’re setting the picker to a real value with val. But as you know a placeholder is as its name says a place holder not a real value. With this you’re assigning the picker to a value. With placeholder the picker is empty. The correct way will have been to set the placeholder attribute of the picker input to some value.

document.getElementById(lilSuckersID).placeholder = placeholderHere

Also the below code as you suggested will break the picker in the sense that is directly setting a value to the picker’s input instead of using the pickers api method for setting a date value.

Which means you wont be able to use the picker’s methods like get value. You will have to get the value with javascript. The preferred way that wont break the picker should be

resetHim.selectDate(valueAfterReset);

Eventhough i’ve updated the plugin and users dont need to use these hacks i just wanted to point these out in case someone tries to use your code and wasn’t getting the expected results.

Thanks for the hack though while i wasn’t been responsive.

seanhoots · December 4, 2017, 2:44am

Hey @florent.bocquelet see current update for placeholder.
Thanks

seanhoots · December 4, 2017, 2:50am

Hey @starnapp the picker works in a reusable element. If you’ve still not gotten it to work let me know.

seanhoots · December 4, 2017, 3:02am

Hey @jordan.shotwell, yes i will be adding autobinding once i know whether users prefer it for a single date or multiple dates (i can only do one).

seanhoots · December 4, 2017, 3:02am

Hey @gf_wolfer, you got your wish. see latest update. Thanks

seanhoots · December 4, 2017, 3:03am

Hey @starnapp the picker works inside a reusable element. If it’s still not working for you let me know.
Thanks

seanhoots · December 4, 2017, 3:04am

Hey @Jici, the latest update has a reset action you can call in your workflows.
Thanks

jarrad · December 4, 2017, 3:08am

@seanhoots, Good to see your back at it. Sorry but in this case your incorrect, What your saying in the real world would in fact be true, but we live in bubble the result of running my code:

Notice the value, bubble will in fact still consider this value as its actual value.

however running your code,

does not work, even if I was to amend it to,

var lilSuckersID = "Your-ID";
var placeholderHere = "Your-Placeholder";
document.getElementById(lilSuckersID).placeholder = placeholderHere;

or keeping it inline with your original,

document.getElementById(‘YOUR-ID’).placeholder = “Your-Placeholder”;

seanhoots · December 4, 2017, 3:09am

Hey @thefiend, unfortunately you can’t select multiple times for a single date. But since you can select multiple times one way of achieving this is to have a picker to select a single date and another picker to select multiple times.