Documentation

Jewish Calendar

Thank you so much for using our Jewish Calendar.

If you have any questions that are beyond the scope of this help file, Please feel free to email.

Installation

Follow the steps below to setup Jewish Calendar on your site:

1. The main requirement, web site should use jquery version 3.x and jquery ui version 1.12.x You can connect to your site the libraries directly from jquery site: https://code.jquery.com/jquery-3.2.0.min.js
https://code.jquery.com/ui/1.12.1/jquery-ui.min.js
https://code.jquery.com/ui/1.12.0/themes/smoothness/jquery-ui.css
2. You should connect to your website the main files of calendar
   Javascript: https://dtpicker.jewishluach.com/Scripts/jewishluach.js
   CSS: https://dtpicker.jewishluach.com/Content/calendar/cangas.datepicker.css
3. You are good to go for adding calendar to your web site!

Dropdown calendar

The calendar can be created as dropdown near button or input box in the following way:

 $("#calendar").jewishluach({
            hebrewDateLongContainer: ".hebr-date",
            gregorianDateContainer: ".greg-date-text",
            yiddishDateContainer: ".yiddish-date",
            parsheDateContainer: ".parshe-day",
            hebrewDateContainer: ".hebrew-date",
            calendarType: $("#calType").val(),
            date: sdate,                
            hideAfterClick: true,
            loaded: function () {
                $("#test").css("display", "block");

            }
        });

Options:

טו תשרי תשפב

9/21/2021

טו תשרי תשפב

ג' וזאת הברכה, א' דסוכות תשפב

Tishrei 15 5782

Background calendar

We can use calendar for retrieving the date in diffident format in background without UI

It can be achieved using the flowing code:

 	$("#calendar-hidden").jewishluach({
            hebrewDateLongContainer: ".hebr-date",
            gregorianDateContainer: ".greg-date-text",
            yiddishDateContainer: ".yiddish-date",
            parsheDateContainer: ".parshe-day",
            hebrewDateContainer: ".hebrew-date",
            calendarType: $("#calType").val(),
            date: sdate,
            loaded: function (data) {
                $("#test").css("display", "block");
                jQuery('.ui-widget-overlay').bind('click', function () {
                    $('#calendar').hide();
                });
                $(".greg-date").prop("value", data.date_short);
            },
            onlyLoadData: true
        });

The functionality works at the same way as with UI, but in this case date will be transform to diffident format of date and UI won't be shown. The result can be received in loaded hook and all container will be filled by received values.

Options:

{
    curent_herb_day, //requested herb date
    herb_date, 		 //requested herb date
    date_short, 	 //short gregorian date
    date_long,       //long gregorian date
    data_herb_yiddishdate, //yiddish date
    data_herb_parsheday, //parshe day
    data_herb_hebrewdate //hebrew date
}

Standalone calendar

We can create the static not hidden calendar. We just need to create the same as dropdown just change the hideAfterClick to false and use container as div

Events

Supporter events for calendar

OnChange event

The onchange event can be used in the same way as usual jquery element. The event is fired when the date was selected:

Example of using:

$("#calendar").on("change", (e, data) => {
            $(".greg-date").prop("value", data.date_short);
        });

FAQ

A FAQ is a list of frequently asked questions (FAQs) and answers on a particular topic.