I have a form for event registration under my site that contains two time select fields, an arrival time and departure time. What I want to do is to have the number of hours between these two times calculated and displayed in the 'Total Hours' field automatically before the form is submitted if possible. I'm thinking that I'll need a bit of jQuery to accomplish this or perhaps by using the entry_submission_start hook. Any tips or examples for accomplishing this would be greatly appreciated! Thanks
2
-
1If you need something be calculated after the load of the form and before its send, white some javaScript. You don't even need jQuery.– SobralCommented Nov 13, 2014 at 23:03
-
Thank you Robson for your suggestion. My JavaScript is not too strong do you have any examples that I could see for something like this? Field_id_688 is arrival time and field_id_689 is departure time so if I can get JavaScript to subtract the arrival time from departure time and place the total into field_id_690 that would be perfect!– Andrew CurrieCommented Nov 25, 2014 at 16:22
Add a comment
|
2 Answers
You would need to write an Accessory which uses Javascript/jQuery to grab the data in the fields (say when both fields contain something), perform the calculation and insert it into a third field.
Start by converting the dates/times into timestamps. This will allow you to subtract one from the other. Then convert the resulting timestamp back into hours. You may also find that momentjs would be useful for this but is probably not necessary.
If you don't need this to work on other sites and you know the names of the fields it should be simple.
Look at http://pkg.io for a good starting point to get the necessary outline for you Accessory.
UPDATE:
I very quickly put together an Accessory for you. You'll need to change the field names within the views/accessory_datecalc.php file. Use with caution as it's very rough! Download it here
-
Thank you foamcow for the answer and example accessory! I have it installed now but still unable to get it working. I don't need this to work on other sites and yes I know the field names. Field_id_688 is arrival time field_id_689 is departure time and field_id_690 is where I want the total hours entered. I suppose I need some code to trigger the accessory in my form template, right? Do you have any tips on how I would go about that? Thanks! Commented Nov 25, 2014 at 16:19
-
I think I misunderstood. The accessory works in the control panel. If you want to do this on a regular template then it's a case of adding some Javascript to the template. You can use the javascript that's in the accessory.– foamcowCommented Nov 26, 2014 at 8:51
-
If you DO want to use it in the Controlpanel then put the accessory in your system/third_party directory and edit it directly to use your fields. That should be all that is needed (ensure you have jQuery for the CP installed too)– foamcowCommented Nov 26, 2014 at 8:52
Thanks for comments and for your example accessory foamcow. Reviewing your code helped me get on the right track and I eventually achieved what I needed by creating a little JavaScript snippet for use in my template. If anyone is interested in seeing the code have a look at http://paste.ee/p/9nKli and in the front-end template I just used <span id="time_spent"></span> to display the total.
answered Dec 5, 2014 at 15:36
