تقویم فارسی جاوااسکریپت

دوشنبه 6 خرداد 1392

تقویم فارسی جاوااسکریپت <br/> وارد کردن تاریخ شمسی در نرم‌افزارهای تحت وب( Web Application ) با به گونه‌ای که سازگاری با مرورگرهای مختلف و بیشترین کارایی فراهم شود یکی از دغدغه‌های مهم برنامه‌نویسان وب است.

وارد کردن تاریخ شمسی در نرم‌افزارهای تحت وب( Web Application ) با به گونه‌ای که سازگاری با مرورگرهای مختلف و بیشترین کارایی فراهم شود یکی از دغدغه‌های مهم برنامه‌نویسان وب است.

کاری از آقای امیر مسعود ایرانی

تقویم فارسی جاوااسکریپت امیب

تقویم‌های گوناگونی توسط افراد مختلف نوشته شده‌اند که هر یک مشکلات خاص خود را دارند. برای از بین بردن تمامی مشکلات موجود، تصمیم گرفتم تقویم جدیدی با قابلیت‌های منحصربه‌فرد و بیشترین کارایی را از پایه طراحی و کدنویسی کنم

سه ویژگی مهم در تقویم ایجاد شده عبارتند از:

  • دقیق‌ترین الگوریتم محاسبه‌ی تاریخ با پشتیبانی از سال‌های خورشیدی تا سال ۹۹۹۹
  • شناسایی هوشمند بیش از ۱۸ مدل ورود دستی تاریخ توسط کاربر
  • تغییر ظاهر تقویم تنها با امکانات CSS

مهم‌ترین ویژگی این تقویم امکان ورود تاریخ به صورت دستی توسط کاربر است:
فرمت‌های قابل قبول برای ورود تاریخ عبارتند از:

  • ۹۰۰۸۱۴
  • ۱۴۰۸۹۰
  • ۱۳۹۰۰۸۱۴
  • ۱۴/۸/۹۰
  • ۹۰/۸/۱۴
  • ۱۴/۸/۱۳۹۰
  • ۱۳۹۰/۸/۱۴
  • ۱۴-۸-۹۰
  • ۹۰-۸-۱۴
  • ۱۴-۸-۱۳۹۰
  • ۱۳۹۰-۸-۱۴

و فرمت‌های ویژه:

  • ۰۸۱۴
  • ۱۴۰۸
  • ۱۴-۸
  • ۸-۱۴
  • ۱۴/۸
  • ۸/۱۴
  • ۱۴

در فرمت‌های ویژه که سال و ماه وارد نشده‌اند، سال و ماه فعلی به حساب خواهد آمد.
در فرمت‌هایی که سال مشخص نشده باشد، دو رقم ابتدایی در صورت امکان روز محاسبه خواهند شد

روش به‌کارگیری تقویم در صفحات وب

استفاده از این تقویم بسیار ساده است
ابتدا فیلد متنی خود را در متن صفحه قرار دهید:

سپس فایل جاوااسکریپت و قالب‌بندی CSS را در سرآمد فایل HTML قرار دهید:

دستور تبدیل فیلد متنی به فیلد تاریخ را در انتهای صفحه و در تگ اسکریپت قرار دهید:

پارامتر تعریف شده شناسه‌ی( id ) فیلد متنی است که به فیلد تاریخ تبدیل خواهد شد.

پارامتر دوم به تنظیمات اضافی اختصاص دارد و اختیاری است
پارامتر دوم شیءی درون‌خطی با فرمت JSON است. برای نمونه به مثال زیر توجه کنید:

دستور بالا سبب می‌شود فیلد اضافی با شناسه‌ی extra تاریخ را با فرمتی دیگر ذخیره کند
این قابلیت به برنامه‌نویسان در ارزیابی و تبدیل تاریخ یاری می‌رساند

گزینه‌های قابل تغییر – اختیاری


  • extraInputID : شناسه‌ی فیلد اضافی
  • extraInputFormat : فرمت فیلد اضافی
  • onchange: تابعی که هنگام تغییر تاریخ به صورت خودکار فراخوانی می‌شود( به مثال‌ها مراجعه کنید )
  • initialDate: تاریخ پیش‌فرض که هنگام ایجاد فیلد در آن قرار می‌گیرد.
  • defaultDate: چنانچه مقدار فیلد تاریخ معتبری نباشد و کاربر تقویم را باز کند، این تاریخ به او نشان داده می‌شود.
  • divPickerClassName : نام کلاس div اصلی حاوی تقویم برای قالب‌بندی
  • btnClassName : نام کلاس a دکمه‌ی تقویم برای قالب‌بندی

فرمت‌های قابل قبول برای فیلد اضافی عبارتند از:

  • YYYY سال میلادی – چهار یا پنج رقمی
  • MM ماه میلادی – دو رقمی
  • DD روز میلادی – دو رقمی
  • YY سال میلادی – دو رقمی
  • M ماه میلادی – یک یا دو رقمی
  • D روز میلادی – یک یا دو رقمی
  • yyyy سال خورشیدی – چهار رقمی
  • mm ماه خورشیدی – دو رقمی
  • dd روز خورشیدی – دو رقمی
  • yy سال خورشیدی – دو رقمی
  • m ماه خورشیدی – یک یا دو رقمی
  • d روز خورشیدی – یک یا دو رقمی
  • JD روز جولین( تعداد روزهای گذشته از یکم ژانویه سال ۴۷۱۳ پیش از میلاد مسیح(ع) )

فهرست قابلیت‌های تقویم شمسی جاوااسکریپت


  • تغییر ماه و سال با کلیک بر روی دکمه‌های قبل و بعد
  • تغییر ماه و سال با امکان انتخاب از فهرست
  • افزایش و کاهش تاریخ با استفاده از کلیدهای بالا و پایین در فیلد
  • امکان فعال و غیرفعال کردن تقویم به صورت موقت
  • تغییر تاریخ به تاریخ فعلی با کلیک بر روی لینک مخصوص
  • ارزیابی ورودی کاربر و تشخیص تاریخ با ۱۸ فرمت مختلف
  • تغییر قالب DatePicker تنها با تغییر در فایل CSS
  • تشخیص اعداد فارسی و لاتین
  • امکان تبدیل آنلاین تاریخ به فرمت‌های مختلف و ذخیره در فیلد اضافی
  • پشتیبانی از مرورگرهای مختلف
  • مصرف کم حافظه، سرعت و دقت بسیار بالا
  • حجم کم سرآمد( تنها ۱۴ کیلوبایت )
  • استفاده‌ی بسیار آسان
فایل های ضمیمه

ایمان مدائنی

نویسنده 1299 مقاله در برنامه نویسان

کاربرانی که از نویسنده این مقاله تشکر کرده اند

در صورتی که در رابطه با این مقاله سوالی دارید، در تاپیک های انجمن مطرح کنید