User Guide AceCalendar Builder Example Product Page Technical Support Online Store

 

AceCalendar

Product Information

Overview

ACECalendar is a versatile JavaScript date picker that can be integrated seamlessly into your forms so that visitors can fill up the data fields of your forms easily, quickly and accurately.

Features

  • Free technical support
  • Free setup support (for registered users only)
  • Installation Instructions

    Configure the calendar using the calendar builder

    Configure the calendar using ACECalendar Builder. Detailed instructions and descriptions for the input fields can be found on the page itself. As a quick start, you could load the calendar code in the example, paste it in the text area and click on Load Code to load the calendar configuration in the example.

    Paste the generated code on your web page at the location where you want the calendar to appear. If you want the calendar to appear in a new window and return the values to your form, you could refer to the following section.

    That's all you need to do to integrate the calendar to your form!

    Important Notes:

    1. The calendar must be embedded within <form></form> tags. The form name must be specified in the builder.
    2. It is not necessary to specify the day, month and year field names if you have only one calendar on the page. But we strongly recommend you to do so in order to have control over the names of the input fields. By default, the names are yr_num, mo_num and dt_num respectively.
    3. If you have several calendars on the same page, the calendar name must be different for each calendar.
    4. If you have several calendars in the same form, the name of the year, month and day field must be different for each calendar.

    Advanced Issues

    Changing the name of the months in the dropdown list

    You may want to change the names of the month in the dropdown list, especially if your web site is in another language other than English. To modify the dropdown list, add the highlighted line to the calendar code at the position indicated:

    var oCal_1 = new AceCalendar();
    oCal_1.setName("oCal_1");
    oCal_1.months = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'];
    oCal_1.setFormName("myForm");
    ...

    Ensure that there are 12 elements in the array.

     

    Changing the days of the week on the calendar

    You may want to change the names of the month in the dropdown list, especially if your web site is in another language other than English. To modify the dropdown list, add the highlighted line to the calendar code at the position indicated:

    var oCal_1 = new AceCalendar();
    oCal_1.setName("oCal_1");
    oCal_1.days = ['M', 'T', 'W', 'T', 'F', 'S', 'S'];
    oCal_1.setFormName("myForm");
    ...

    Ensure that there are 7 elements in the array.

    Using JavaScript to retrieve the date from the calendar

    You could interface AceCalendar with your own JavaScript functions. The following methods are available for retrieving the date from the calendar.

    Function Name Description
    getDay() Returns the day of the month ( 1 - 31 )
    getMonth() Returns the month ( 0 - 11)
    getYear() Returns the 4 digit year
    getString() Returns the date in locale string format

     

    Calling an external JavaScript function whenever the date is modified

    The setAction function of the AceCalendar class is called whenever the date is modified. By default, it is empty. You could override the function to perform additional tasks. An example can be found in popup_calendar.htm

     

    Creating popup calendars and integrating them to your form

    ACECalendar can also be customized as a popup calendar. The calendar will appear at the click of a button and whenever the user modifies the date, it is passed back to the form. You need some knowledge of JavaScript and HTML to follow the instructions below. Alternatively, we also provide customization services at very reasonable rates.

    1. Create the popup page containing the calendar. Do not forget to embed the calendar within <form></form>
    2. Override the setAction function of the AceCalendar class. The function is called whenever the date is modified. By default, it is empty. Modify the function such that it will pass back the variables to the opener page.

    A complete example can be found in the download. Please refer to popup_calendar.htm (popup page) and acecalendar_example.htm (opener page) in the download.

     

    Technical Support

    If you experience problems installing or using the script, you could consult our Technical Support online or send us an email describing the problem, together with the URL of the web page or an attachment of the necessary files. All the files should be placed in a zip file to facilitate easy retrieval.

    Feedback and suggestions are most welcome. We greatly appreciate user comments to help us to improve on the product and documentation.

     

    Product Registration

    The script is free only for non-commercial web sites. For commercial usage, you have to purchase the script to remove the credit link. Details on the pricing, ordering process and customer support can be found on the product order page.

     

    License Agreement

    All copyrights to the software are exclusively owned by NavSurf. You may not use, copy, emulate, clone, sell, modify, distribute, decompile, disassemble, reverse engineer or transfer the software, or any portion of it, except as provided for in this agreement. Any unauthorized use of the software will result in criminal and civil prosecution. All rights not expressly granted in this license are reserved by the author. The unregistered version of the software may be freely distributed provided that the distribution package is not modified in any way.

    The copyright owner and author of the software disclaim all warranties either expressed or implied, including, but not limited to implied warranties of merchantability and fitness for a particular purpose, with respect to the software or documentation. In no event will the author or copyright owner be liable for any damages whatsoever (including without limitation to damages for loss of business profits, business interruption, loss of business information and the like) arising out of the use or the inability to use this product.

    Installing and using this software signifies acceptance of these terms and conditions. If you do not agree with the terms of this license, you must cease to use the product and remove the files immediately.

     

    User Guide AceCalendar Builder Example Product Page Technical Support Online Store