Calendar date picker
July 27, 2016 12:00 AM
I'm still relatively new to Lectora and am currently working in Lectora 16. I am currently trying to find the simplest way to add an entry field that is linked to a calendar object, which the user can use to select a date from that will update into the entry field as yyyy mm dd. The user will have three methods of inputting and outputting the calendar information: the entry field, the calendar object, and a table (that updates with each entry saved). Would need to know how to tie the calendar code to the table as well.
This information will need to be able to be saved (stored) to be used in other sections of the page.
Discussion (10)
I like the idea of always being able to insert a calendar into Lectora so I put a new feature request in.
Thank you for your quick responses, thus far. I'm currently, trying to find a simpler jQuery (as the ones I found beforehand were not simple or written in javascript) that will allow me to edit and input it into Lectora the way Mr. Snegirev suggested above then add the other elements and adjustments I need.
If anyone else has other suggestions or examples please don't hesitate to send them my way as it will be greatly appreciated and I will be working on this at least another few days.
There is no built-in calendar object but you can add one using JQuery and JQuery UI. Lectora is easily extensible with scrips. I wrote a few articles about it: http://trivantis.com/author/lectorasergey/
It requires some development skills of course. Alternatively, I would actually just instruct users to enter the date in required format manually, which is often easier (I wish more websites with calendar inputs allowed that).
So... I had 20 minutes in between calls, so here goes: http://community.trivantis.com/shared-content/calendar-date-picker-for-entry-field/
Thanks Sergey! I was just now able to get back to that part of my project and I believe that with a few adjustments to display the image the client wanted using that the code you provided will help me a lot. Took me a moment to navigate the community site as this is only third time here, I only saw the the pic at first :/ not the file :).
Welcome back to the Community! If you'd like to learn more about navigating and using the site check out my webinar http://community.trivantis.com/knowledge-base/explore-trivantis-community/ and feel free to reach out to me if you need anything.
-Community Manager :)
Is there a way to make sure that the first or top date (indate) is a date before the second or bottom date (outdate).
ex. Indate: 09/23/16
Outdate: 10/10/16
undefined
Indate: 10/10/16
Outdate: 09/23/16
Below is the JavaScript I adjusted to work with the date picker code that Sergey provided me with but, I can't seem to get Lectora to let me use it in the course directly, and I'm unsure where to place it in the code he provided. Until I can place it, I won't know it the code won't work.
undefined
$( function() {
var dateFormat = "yy-mm-dd",
from = $( "#from" )
.datepicker({
defaultDate: "+1w",
changeMonth: true,
})
.on( "change", function() {
to.datepicker( "option", "minDate", getDate( this ) );
}),
to = $( "#to" ).datepicker({
defaultDate: "+1w",
changeMonth: true,
})
.on( "change", function() {
from.datepicker( "option", "maxDate", getDate( this ) );
});
undefined
I also thought I could try to run a javascript that would test each entry field after the save function (button) has been pressed, before locking or displaying a message.
undefined
But, since the main part of the datepicker's jquery is an external, I'm not sure if Lectora can code ontop of an external source of code.
Discussions have been disabled for this post