แนวทางการปรับปีเป็น พ.ศ. ใน fullcalendar อย่างง่าย

เขียนเมื่อ 7 ปีก่อน โดย Ninenik Narkdee
ปี พ.ศ. fullcalendar thai fullcalendar

คำสั่ง การ กำหนด รูปแบบ ตัวอย่าง เทคนิค ลูกเล่น การประยุกต์ การใช้งาน เกี่ยวกับ ปี พ.ศ. fullcalendar thai fullcalendar

ดูแล้ว 11,375 ครั้ง




เนื้อหาต่อไปนี้เป็นแวทางการปรับปีของ fullcalendar ให้เป็นปี พ.ศ. โดยจะมี 2 แนวทาง
แนวทางแรกคือการเพิ่มการจัดรูปแบบหลังจาก viewRender ซึ่งจะไม่ค่อยเนียนเท่าไหร่
เนื่องจากเป็นการเปลี่ยนข้อความในส่วนของ title หลังจาก การ render แล้ว
วิธีการคือ แทรกโค้ดส่วนของการ viewRender เข้าไปในส่วนที่เรียกใช้งานดังนี้
 
		viewRender: function(view, element) {		
			setTimeout(function(){
				var strDate = $.trim($(".fc-center").find("h2").text());
				var arrDate = strDate.split(" ");
				var lengthArr = arrDate.length;	
				var newstrDate = "";
				for(var i=0;i<lengthArr;i++){
					if(lengthArr-1==i || parseInt(arrDate[i])>1000){
						var yearBuddha=parseInt(arrDate[i])+543;
						newstrDate+=yearBuddha;
					}else{
						newstrDate+=arrDate[i]+" ";						
					}
				}
				$(".fc-center").find("h2").text(newstrDate);					
			},5);
		}	
 
 
แนวทางที่สอง แก้ไขในส่วนของไฟล์ fullcalendar.js โดยให้เปิดไฟล์ fullcalendar.js แล้วไปที่บรรทัด
 
	function updateTitle(text) {
		el.find('h2').text(text);
	}	
 
แล้วทำการแก้ไขใหม่เป้นดังนี้
 
	function updateTitle(text) {
		var strDate = $.trim(text);
		var arrDate = strDate.split(" ");
		var lengthArr = arrDate.length;	
		var newstrDate = "";
		for(var i=0;i<lengthArr;i++){
			if(lengthArr-1==i || parseInt(arrDate[i])>1000){
				var yearBuddha=parseInt(arrDate[i])+543;
				newstrDate+=yearBuddha;
			}else{
				newstrDate+=arrDate[i]+" ";						
			}
		}		
		el.find('h2').text(newstrDate);		
	}
 
หลังจากแก้ไขแล้ว เราสามารถทำการบีบอัดไฟล์ให้เล็กลงผ่านเว็บไซต์ 
http://jscompress.com/ แล้วบันทึกกลับเป็นไฟล์ชื่อ fullcalendar.min.js แล้วนำไปใช้งานได้
ผลลัพธ์ที่ได้จะดีกว่าวิธีแรก แต่ก็จะยุ่งยากขึ้นมาเล็กน้อย 
เท่านี้เราก็สามารถแสดงปี ค.ศ. เป้นปี พ.ศ. ใน fullcalendar ได้แล้ว


   เพิ่มเติมเนื้อหา ครั้งที่ 1 วันที่ 27-10-2017 ( เนื้อหา [เพิ่มเติมเนื้อหา ครั้งที่ 1] นี้ไม่อัพเดท ไม่เหมาะนำไปใช้งานแล้ว)

   เพิ่มเติมเนื้อหา ครั้งที่ 2 วันที่ 04-03-2019


อัพเดท แจกโค้ดตัวอย่าง fullcalendar เวอร์ชั่น 3.6.2 ฉบับปรับแต่ง รองรับภาษาไทย และปี พ.ศ.
ดาวน์โหลดได้ที่ http://bit.ly/2ELhkEI
 
อัพเดท แจกโค้ดตัวอย่าง fullcalendar เวอร์ชั่น 3.10.0 ฉบับปรับแต่ง รองรับภาษาไทย และปี พ.ศ.
ดาวน์โหลดได้ที่ http://bit.ly/2TxxQA8
 
หากต้องการคงเฉพาะปี เป็น ค.ศ ให้แก้ไข ย้อนกลับ โดยเปลี่ยนโค้ดกลับคืน ในไฟล์
fullcalendar.js ในโฟลเดอร์ fullcalendar-3.6.2 หรือ fullcalendar-3.10.0 
จากนั้น สามารถนำไปใช้ได้เลย หรือจะย่อขนาดไฟล์เหมือนเดิมก็ได้


กด Like หรือ Share เป็นกำลังใจ ให้มีบทความใหม่ๆ เรื่อยๆ น่ะครับ







เนื้อหาที่เกี่ยวข้อง









URL สำหรับอ้างอิง





คำแนะนำ และการใช้งาน

สมาชิก กรุณา ล็อกอินเข้าระบบ เพื่อตั้งคำถามใหม่ หรือ ตอบคำถาม สมาชิกใหม่ สมัครสมาชิกได้ที่ สมัครสมาชิก


  • ถาม-ตอบ กรุณา ล็อกอินเข้าระบบ
  • เปลี่ยน


    ( หรือ เข้าใช้งานผ่าน Social Login )







เว็บไซต์ของเราให้บริการเนื้อหาบทความสำหรับนักพัฒนา โดยพึ่งพารายได้เล็กน้อยจากการแสดงโฆษณา โปรดสนับสนุนเว็บไซต์ของเราด้วยการปิดการใช้งานตัวปิดกั้นโฆษณา (Disable Ads Blocker) ขอบคุณครับ