تقویم شمسی جاوااسکریپت (مبتنی بر jquery). در این صفحه (دمو) از bootstrap و font awesome هم استفاده شده است (فقط برای نشان دادن سازگاری تقویم)
پس از اضافه کردن jquery به پروژه فایل های kamadatepicker.js و kamadatepicker.css را هم به پروژه خود اضافه کنید.
HTML:
<input type="text" id="test-date-id">
JavaScript:
kamaDatepicker('test-date-id');
همچنین می توانید تنظیمات دلخواه را به عنوان پارامتر دوم اضافه کنید.
JavaScript:
kamaDatepicker('test-date-id', { buttonsColor: "red", forceFarsiDigits: true });
| توضیحات | مقدار پیشفرض | مقادیر قابل قبول | نام |
|---|---|---|---|
| - | "" | string | placeholder |
| در صورتی که true باشد اعداد یک رقمی مثل هشت با یک صفر اضافه (08) نمایش داده می شوند. | true | true, false | twodigit |
| در صورتی که true باشد تقویم بعد از انتخاب یک روز بسته می شود. | true | true, false | closeAfterSelect |
| می توانید آدرس یک عکس یا یک class از font awesome یا glyphy icons را به صورت string پاس دهید تا به جای عبارت "بعدی" در تقویم نمایش داده شود. | بعدی | string | nextButtonIcon |
| می توانید آدرس یک عکس یا یک class از font awesome یا glyphy icons را به صورت string پاس دهید تا به جای عبارت "قبلی" در تقویم نمایش داده شود. | قبلی | string | previousButtonIcon |
| می توانید یکی از اسامی استاندارد رنگ ها مانند "red" یا به صورت "#FF0000" را پاس دهید. | پیشفرض | string | buttonsColor |
| در صورتی که true باشد بدون توجه به اینکه اعداد فارسی در فونت استفاده شده پشتیبانی می شوند یا نه، تقویم از اعداد فارسی برای نمایش اعداد استفاده می کند. | false | true, false | forceFarsiDigits |
| در صورتی که true باشد تاریخ امروز را متامیز از بقیه روزها نشان می دهد. | false | true, false | markToday |
| در صورتی که true باشد روزهای تعطیل (فعلا فقط جمعه ها) را متمایز از بقیه روزها نشان می دهد. | false | true, false | markHolidays |
| در صورتی که true باشد تاریخ انتخاب شده را متمایز از بقیه روزها نشان می دهد. | false | true, false | highlightSelectedDay |
| در صورتی که true باشد تقویم بعد از باز شدن سال و ماه متناسب با مقدار ورودی را نشان می دهد، در غیر اینصورت همیشه تاریخ امروز نمایش داده خواهد شد. | false | true, false | sync |
| در صورتی که true باشد دکمه "برو به امروز" در پایین تقویم نمایش داده می شود. | false | true, false | gotoToday |
| تعداد سال‌های قابل انتخاب، قبل از سال جاری | 95 | number | pastYearsCount |
| تعداد سال‌های قابل انتخاب، بعد از سال جاری | 6 | number | futureYearsCount |
| جابجا کردن دکمه‌های ماه بعدی و قبلی | false | true, false | swapNextPrev |
موقعیت نمایش تقویم
|
bottom | top, bottom, auto | position |
| id مربوط به parent element که موقعیت نمایش تقویم باید نسبت به آن محاسبه شود. | string | parentId |