نمایش نتایج: از شماره 1 تا 2 از مجموع 2
سپاس ها 3سپاس

موضوع: پیاده سازی تقویم شمسی در شیرپوینت با استفاده از جاوا اسکریپت ( قسمت دوم )

  
  1. #1
    نام حقيقي: ramin ahmadi

    عضو عادی
    تاریخ عضویت
    Feb 2009
    محل سکونت
    tehran
    نوشته
    38
    سپاسگزاری شده
    125
    سپاسگزاری کرده
    12

    پیاده سازی تقویم شمسی در شیرپوینت با استفاده از جاوا اسکریپت ( قسمت دوم )

    در قسمت قبلی مقاله مشاهده کردید که چگونه میتوان تاریخ هایی که در یک صفحه قرار دارد را به شمسی تغییر داد ، در این مقاله قصد دارم به شما آموزش دهم چگونه با استفاده از Jquery و جاوا اسکریپت Date Picker شیرپوینت را به شمسی تغییر دهید .
    اگر ستونی از نوع تقویم در لیست های خود داشته باشید هنگام ایجاد یا ویرایش یک مورد جدید Date Picker شیرپوینت با توجه نوع تقویم انتخاب شده به شکل زیر نمایش داده میشود :





    اگر به سورس صفحه مراجعه کنیم ، میبینم برای هر Picker کدی به شکل زیر ایجاد شده است :





    پس ما میتوانیم با تغییر دادن این قسمت و ایجاد کدهایی برای Picker شمسی به هدف خود برسیم !
    اما قبل از این کار ما نیاز به یک Date Picker خوب شمسی داریم ، من اینجا از Date Picker که دوست خوبم مهدی هاشمی نژاد در بلاگشون معرفی کردند استفاده میکنم ، که میتوانید توضیحات و سورس کامل این Picker را از اینجادریافت نمایید.
    من آخرین فایل ها را با کمی تغییر و ایجاد نسخه نهایی از آن برای استفاده در شیرپوینت آماده کردم که برای مرحله اول کار می بایست این فایل ها را از اینجا
    دریافت نمایید .
    فایل ها را از حالت فشرده خارج و در مسیر زیر کپی نمایید :


    C:\Program Files\Common Files\Microsoft Shared\Web Server Extensions\14\TEMPLATE\IMAGES


    اگر یادتون باشه در قسمت قبلی مقاله ما تغییراتی را در فایل Master Page سایتی که میخواهیم از تقویم شمسی در آن استفاده کنیم ایجاد کردیم ، برای اضافه کردن کدهای جدید این فایل را باز کرده و کدهای زیر را قبل از بسته شدن تگ Head (کلمه </head> را جستجو کنید )به آن اضافه کنید :
    کد:
    <link type="text/css" href="/_layouts/images/jquery-ui-1.8.14.css" rel="stylesheet" />
    <script type="text/javascript" src="/_layouts/images/jquery-1.6.2.min.js"></script>
    <script type="text/javascript" src="/_layouts/images/jquery.ui.datepicker-cc.all.min.js"></script>
    حالا به انتهای فایل رفته و در قسمتی که کدهای مقاله پیش را وارد کرده بودید ، کدهای زیر را اضافه کنید :
    کد:
    changeDatePickerToPersian();
            // تغییر پیکر تاریخ
            function changeDatePickerToPersian()
            {
                $(function() {
                    var tags = document.getElementsByTagName('IMG');
                    for (var i = 0; i < tags.length; i++) 
                    { var tempString = tags[i].id;
                         if (tempString.indexOf('DatePickerImage') != -1){
                         document.getElementById(tempString).style.display = 'none';
                         var dtcontrolId = tempString.replace('DatePickerImage','');                 
                         $("#" + dtcontrolId).datepicker({showOn: 'button',buttonImage: '/_layouts/images/calendar.gif',buttonImageOnly: true});
                         }
                    }
                });
            
            }
    فایل را ذخیره کرده ، به یکی از لیست هایی که دارای ستون تقویم میباشد مثل لیست وظایف رفته و مورد جدیدی را ایجاد یا موردی را ویرایش کنید ، میتوانید Date Picker شمسی را مشاهده کنید و از انتخاب آن لذت ببرید !

    اما تغییر کوچک دیگری نیز باید در کدها ایجاد کنیم ، اگر به تصویر بالا نگاه کنید زمانی که ستون دارای مقدار پیش فرض می باشد یا زمانی که در حالت ویرایش مورد این ستون از قبل مقدار گرفته باشد ، تاریخی که در این ستون نمایش داده می شود به صورت میلادی است که باید مقدار آنرا به شمسی تغییر دهید ، ما توابع تبدیل را در اختیار داریم و آن را در فایل Master Page وارد کردیم ، پس تنها کاری که باید انجام بدیم پیدا کردن این کنترل و تغییر مقدار آن می باشد که توسط کد زیر صورت می گیرد :
    کد:
    var DateValue = document.getElementById(dtcontrolId).value;
    if(DateValue)
    {                        
        Year = new Number(DateValue.substring(0, 4));                    
        Month = new Number(DateValue.substring(5, 7));
        Day = new Number(DateValue.substring(8, 10));
        if(Year > 2000)
        {
            // تبدیل تاریخ میلادی به شمسی
            var j = gregorian_to_jd(Year,Month,Day);
            perscal = jd_to_persian(j);
            pyear = perscal[0];
            pmonth = perscal[1];
            pday = perscal[2];
                                
            if(Number(pmonth) < 10)
                pmonth = "0" + pmonth;
    
    
            if(Number(pday) < 10)
                pday = "0" + pday;                            
            
            // ذخیره مقدار تاریخ شمسی
            var shamsiDate = pyear + "/" + pmonth + "/" + pday;
                                
            // جایگذاری مقدار تاریخ میلادی با شمسی
            document.getElementById(dtcontrolId).value = shamsiDate;
        }
    }
    که بعد از انجام این تغییرات در هنگام لود شدن کنترل تاریخ میلادی به شمسی تغییر خواهد یافت :





    در نهایت ما تابعی خواهیم داشت که Date Picker میلادی را به شمسی تغییر خواهد داد !
    در قسمت بعدی مقاله به نحوه ذخیره این تاریخ ها خواهم پرداخت ، منتظر نظرات شما هستم ! ضمناً دوستانی که مایل هستند در پروژه فارسی سازی شیرپوینت فاندیشن 2013 با من همکاری داشته باشند لطفا مشخصاتشون رو به من ایمیل کنند .
    کدهای نهایی که در واقع کدهای این قسمت و کدهای قسمت قبل می باشد را میتوانید ازاینجا
    دریافت کنید .
    موفق و پیروز باشید.
    رامین احمدی



    موضوعات مشابه:
    robin808، EVERAL و hosseinikk سپاسگزاری کرده‌اند.

  2. #2


    عضو عادی شناسه تصویری aminlv
    تاریخ عضویت
    Jun 2004
    محل سکونت
    Some Where in Lord Island
    نوشته
    43
    سپاسگزاری شده
    0
    سپاسگزاری کرده
    1
    مرسی جالب بود من sharepoint 2013 دارم تست می کنم اگر بدون مشکل اونجا هم بود خبر میدم



کلمات کلیدی در جستجوها:

تقویم فارسی با jquery

چگونه تاریخ موبایلم را از میلادی به شمسی تغییر دهم

تقویم شمسی باjavascript

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

سورس نمایش تقویم فارسی

jquery تقویم شمسی

تقويم فارسي جاوا اسكريپت

کد اسکریپت تقویم هاشمی نژاد

تقويم فارسي جاوا اسكريپتي

jquery ui تقویم فارسی

datepicker جاوا اسکریپت

تقویم فارسی jquery

datepicker جاوا

تبدیل تاریخ فارسی با jquery

تقویم شمسی با javascript

persian calendar هاشمی

تاریخ فارسی با jquery

تاریخ شمسی شیرپوینت

jquery persian or farsi تقویم

سورس کد انتخاب تاریخ شمسی توسط DatePicker در jQuery

هاشمی persian calnder

تاریخ شمسی بوسیله jQuery

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

jquery date pickup شمسی

تاری فارسی شیرپونت 2013

برچسب برای این موضوع

مجوز های ارسال و ویرایش

  • شما نمی توانید موضوع جدید ارسال کنید
  • شما نمی توانید به پست ها پاسخ دهید
  • شما نمی توانید فایل پیوست ضمیمه کنید
  • شما نمی توانید پست های خود را ویرایش کنید
  •