TOPIC:

Time Element 4 years 4 months ago #172442

  • Topic Author
  • stefan@icelink.is
  • Offline
  • Fresh Breezer
  • Fresh Breezer
  • Posts: 5
  • Thanks: 0
Hi

How can I add PickTime to a form, there is a calendar element but no time element, I want the user to select the time instead of typing it.

Regards,
Stefan

Please Log in or Create an account to join the conversation.

Time Element 4 years 4 months ago #172476

  • pedro81's Avatar
  • pedro81
  • Offline
  • Ultimate Breezer
  • Ultimate Breezer
  • Posts: 15273
  • Karma: 287
  • Thanks: 1075
Hi Stefan,

you can build it fastly using two select list with the hours and minutes, what do you think about this solution?

Please Log in or Create an account to join the conversation.

Time Element 4 years 4 months ago #172489

  • Topic Author
  • stefan@icelink.is
  • Offline
  • Fresh Breezer
  • Fresh Breezer
  • Posts: 5
  • Thanks: 0
Hi

Yes that could work, but how can I position two select lists side by side ?

Please Log in or Create an account to join the conversation.

Time Element 4 years 4 months ago #172493

  • Tihomir's Avatar
  • Tihomir
  • Offline
  • User is blocked
  • User is blocked
  • Posts: 3564
  • Karma: 87
  • Thanks: 288
Hi,

this is an example if you want to implement clokcpicker into the BreezingForms.

1) locate this folder :
components\com_breezingforms\libraries
and copy attached zip file ( clockpicker ) at this location and unzipp the folder

2 ) Once you do it, create an element ( 'textfiled' ) , and put the name 'timepicker'

3) Then go to the form > advanced > more options > Form Pieces > Before Form > Custom , and copy the follwoing scripts into the box :
$this->execPieceByName('ff_InitLib');
echo '<script src="'.JURI::root().'components/com_breezingforms/libraries/clockpicker/js/clockpicker.js" type="text/javascript"></script>';
echo '<link rel="stylesheet" type="text/css" media="all"
href="'.JURI::root().'components/com_breezingforms/libraries/clockpicker/css/clockpicker.css">';
echo '<link rel="stylesheet" type="text/css" media="all"
href="'.JURI::root().'components/com_breezingforms/libraries/clockpicker/css/standalone.css">';

4) once you do it , go to the form > advanced > more options > scripts > custom radio button > create code framework and put the following code into the function :
jQuery('[name="ff_nm_timepicker[]"]').wrap( '<div class="input-group clockpicker"></div>' );

jQuery('[name="ff_nm_timepicker[]"]').after( '<span class="input-group-addon"><span class="glyphicon glyphicon-time"></span></span>' );

jQuery('.clockpicker').clockpicker({
    placement: 'top',
    align: 'left',
    autoclose: true
});

Also , you can find attached an example so you can test it yourself.

Let us know if that worked for you.

Kind regards
===============================================
Support Crosstec and get ALL EXTENSIONS and professional support for just $5
Here!
===============================================
Regards
Tihomir
==========================================
+++ Purchase Professional Support: crosstec.org/en/support/purchase-additional-support.html +++
Attachments:

Please Log in or Create an account to join the conversation.

Last edit: Post by Tihomir.

Time Element 4 years 4 months ago #172524

  • Topic Author
  • stefan@icelink.is
  • Offline
  • Fresh Breezer
  • Fresh Breezer
  • Posts: 5
  • Thanks: 0
Looks great and issue solved.

Thank you very much, brilliant solution !

Please Log in or Create an account to join the conversation.

Time Element 4 years 4 months ago #172530

  • Tihomir's Avatar
  • Tihomir
  • Offline
  • User is blocked
  • User is blocked
  • Posts: 3564
  • Karma: 87
  • Thanks: 288
Great :),

let us know if you need further help.

Kind regards
===============================================
Support Crosstec and get ALL EXTENSIONS and professional support for just $5
Here!
===============================================
Regards
Tihomir
==========================================
+++ Purchase Professional Support: crosstec.org/en/support/purchase-additional-support.html +++

Please Log in or Create an account to join the conversation.

Moderators: ForumSupport
Time to create page: 0.052 seconds

BreezingForms Pro 1.4.7 for WordPress Released!

Available in the membership section.

September Discount!

Massive discounts on all subscriptions!

Get Your Subscription Here

Quick Links

Downloads

BreezingForms

ContentBuilder

BreezingCommerce

Templates

Documentation

BreezingForms

ContentBuilder

BreezingCommerce

Apprendre BreezingForms (French Community)

Apprendre et maîtriser BreezingForms par des tutoriels et exemples, le tout en français

breezingforms.eddy-vh.com

Questions et réponses sur les forums de l'AFUJ

AFUJ

Special Offer

Summer Sale! All subscriptions at a special price!

Includes prio support, all of our current and future Joomla!® extensions and Joomla!® templates for the duration of your membership.

Get it from here

3rd Party Discount - 25% Off

We help you to keep your costs under control. If you are a new member and purchased a form building tool from a different form vendor, then you'll get a 25% discount on our subscription plans.

How to receive the discount:

Send us a quick email to sales@crosstec.org with a proof of purchase (for example a paypal receipt), await payment instructions and enjoy your membership!