ประยุกต์ jQuery UI ปฏิทิน Datepicker แสดงภาษาไทย และใช้ ปี พ.ศ.
09 August 2010ทางเลือก สำหรับคนที่ต้องการใช้ jQuery UI ปฏิทิน Datepicker ใช้ปี พ.ศ. และแสดง ภาษาไทย
ซึ่งประยุกต์เพิ่มเติม จากบทความ
http://www.ninenik.com/เริ่มต้น_jQuery_UI_กับการสร้าง_ปฏิทินเลือกวันที่_datepicker_-212.html
ตัวอย่าง
ดาวน์โหลด jQuery ui เวอร์ชั่นใหม่ ๆ ได้ที่เว็บไซต์ www.jqueryui.com
หรือดาวน์โหลด เวอร์ชันตามตัวอย่าง ได้ที่นี่ http://www.ninenik.com/download/jquery-ui-1.7.2.custom.zip
โค้ดตัวอย่างสำหรับทดสอบ
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jquery ui datepickerภาษาไทย ปี พ.ศ.</title>
<link rel="stylesheet" type="text/css" href="css/smoothness/jquery-ui-1.7.2.custom.css">
<style type="text/css">
/* Overide css code กำหนดความกว้างของปฏิทินและอื่นๆ */
.ui-datepicker{
width:170px;
font-family:tahoma;
font-size:11px;
text-align:center;
}
</style>
</head>
<body>
<input type="text" name="dateInput" id="dateInput" />
<script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.7.2.custom.min.js"></script>
<script type="text/javascript">
$(function(){
var dateBefore=null;
$("#dateInput").datepicker({
dateFormat: 'dd-mm-yy',
showOn: 'button',
buttonImage: 'http://jqueryui.com/demos/datepicker/images/calendar.gif',
buttonImageOnly: true,
dayNamesMin: ['อา', 'จ', 'อ', 'พ', 'พฤ', 'ศ', 'ส'],
monthNamesShort: ['มกราคม','กุมภาพันธ์','มีนาคม','เมษายน','พฤษภาคม','มิถุนายน','กรกฎาคม','สิงหาคม','กันยายน','ตุลาคม','พฤศจิกายน','ธันวาคม'],
changeMonth: true,
changeYear: true ,
beforeShow:function(){
if($(this).val()!=""){
var arrayDate=$(this).val().split("-");
arrayDate[2]=parseInt(arrayDate[2])-543;
$(this).val(arrayDate[0]+"-"+arrayDate[1]+"-"+arrayDate[2]);
}
setTimeout(function(){
$.each($(".ui-datepicker-year option"),function(j,k){
var textYear=parseInt($(".ui-datepicker-year option").eq(j).val())+543;
$(".ui-datepicker-year option").eq(j).text(textYear);
});
},50);
},
onChangeMonthYear: function(){
setTimeout(function(){
$.each($(".ui-datepicker-year option"),function(j,k){
var textYear=parseInt($(".ui-datepicker-year option").eq(j).val())+543;
$(".ui-datepicker-year option").eq(j).text(textYear);
});
},50);
},
onClose:function(){
if($(this).val()!="" && $(this).val()==dateBefore){
var arrayDate=dateBefore.split("-");
arrayDate[2]=parseInt(arrayDate[2])+543;
$(this).val(arrayDate[0]+"-"+arrayDate[1]+"-"+arrayDate[2]);
}
},
onSelect: function(dateText, inst){
dateBefore=$(this).val();
var arrayDate=dateText.split("-");
arrayDate[2]=parseInt(arrayDate[2])+543;
$(this).val(arrayDate[0]+"-"+arrayDate[1]+"-"+arrayDate[2]);
}
});
});
</script>
</body>
</html>
หรือ view source ที่ไฟล์ demo ได้ที่
บทความในหมวดที่่น่าสนใจ อื่นๆ
อ่าน 6995
04 Jun 09
สร้างเมนูย่อย ให้กับข้อความ เมื่อนำเม๊าท์ไปชี้ mouseover ด้วย css และ jquery อย่างง่าย
อ่าน 6959
04 Mar 09
ใช้ jQuery ย้ายค่าระหว่าง multiple list box อย่างง่าย
อ่าน 6889
14 Nov 08
สร้างป้ายโฆษณาเลื่อนตามจอภาพ ด้วย jquery ได้ในไม่กี่บรรทัด
อ่าน 6855
29 Mar 10
สร้างฟอร์ม ดึง พิกัด ค่า latitude และ longitude จาก google map
อ่าน 6663
09 Sep 10
Google map API v.3 กับ jQuery ลากจุดหา พิกัด ค่า latitude และ longitude
อ่าน 6456
25 Sep 08
Jquery javascript library มาแรง
อ่าน 6384
25 Sep 08
มารู้จัก effect ของ jquery อย่างง่าย ตอนที่ 1
อ่าน 6167
01 Feb 09
สร้างกล่องแจ้งข้อความ คล้าย MSN ด้วย jQuery
อ่าน 6023
10 Sep 10
ค้นหา พิกัด ค่า latitude และ longitude ใน Google Map จากฃื่อสถานที่
อ่าน 5752
17 Aug 09
สร้างเมนู เทคนิค ลูกตาปลา ด้วย jQuery อย่างง่าย
อ่าน 5625
03 Nov 10
การเพิ่ม ลบ แก้ไข แบ่งหน้า ข้อมูล ด้วย jquery ajax อย่างง่าย
อ่าน 5502
25 Sep 08
เริ่มต้นกับ jquery
อ่าน 5476
บทความคนเข้าอ่านวันนี้
13 Feb 09 แปลงข้อความเป็นตัวเล็ก toLowerCase ตัวใหญ่ toUpperCase ด้วย javascript อ่าน 1895 27 Mar 10 ทำให้ เลือก list box แล้วแสดง checkbox ด้วย jQuery อ่าน 4708 21 Aug 09 ตรึงหัวข้อ header ในตาราง table ด้วย css รองรับ Firefox และ IE อ่าน 4849 25 Sep 08 รู้จักฟังก์ชันของ jQuery ในการกำหนด Style Sheet อ่าน 3477 25 Sep 08 การใช้งาน CSS ศึกษาิวิธีการนำ CSS ไปใช้กับ HTML อ่าน 6847 17 Nov 09 พิมพ์ข้อมูลใน textbox เพื่อ เพิ่มรายการใน listbox ด้วย jQuery อ่าน 4640 25 Sep 08 Jquery javascript library มาแรง อ่าน 6384 24 Feb 10 เทคนิค สร้าง effect add to cart ด้วย jQuery อย่างง่าย อ่าน 4519 26 Mar 10 ความแตกต่าง ระหว่าง ฟังก์ชัน strstr กับ strrchr และ การประยุกต์ ใช้งาน อ่าน 1244 25 Sep 08 สิ่งจำเป็นก่อนการทำงานของโปรแกรม อ่าน 3364 19 Nov 10 ทางเลือก อัพโหลดไฟล์ใน ckeditor ด้วย ajax file manager อ่าน 2191 15 Nov 08 สร้าง Drag and Drop วัตถุด้วย jQuery โดยไม่ใช้ plug in อย่างง่าย อ่าน 6995 19 Oct 08 คำสั่ง SQL COUNT อ่าน 6576 11 Dec 09 ทบทวน การเรียกใช้งาน events ใน javascript ที่ใช้ได้สำหรับ ทุก browsers อ่าน 2231 14 Feb 09 คำนวณหาอายุ จากวันเกิด ด้วย php อ่าน 4560 26 Mar 09 กำหนดข้อความเริ่มต้นให้กับ input text ด้วย jquery อย่างง่าย อ่าน 3214 11 Aug 10 ปรับแต่ง facebook comments ด้วย css กำหนด style ให้เข้ากับเว็บ อ่าน 17762 12 Nov 09 รู้จักกับ Ajax Events ใน jQuery อ่าน 4247 14 Jan 10 รู้จัก property position ของ css ให้มากขึ้น ด้วย ตัวอย่าง และคำอธิบาย อ่าน 6145 03 Apr 11 จัดข้อความยาว ให้อยู่ในกรอบ ด้วย css break word อ่าน 3291