Drop Down Calendar

โค้ดปฏิทินแบบ Drop Down เป็นปี พศ. Cross Browser (TIS-620)

//Properties
name ชื่อของ Object ถ้ามีมากกว่า 1 ตัวต้องกำหนด calendar (default)
dateformat ฟอร์แมตของวันที่แสดงผล dd/mm/yyyy (default)
day วันที่
month เดือน
year ปี (คืนค่าเป็น คศ. เท่านั้น)
value ค่าวันที่ที่ส่งกลับ ตามฟอร์แมตที่กำหนดไว้
dayofweek Dia de la semana seleccionado Selected day of week
calendar_visibility TRUE แสดงผล
posLeft Absolute position X
posTop Absolute position Y
main_shadow TRUE แสดงเงาใต้ combo
month_shadow TRUE แสดงเงาใต้หน้าต่าง ปฏิทิน

//Methods
parse_dateformat ฟังก์ชั่นสำหรับจัดการรูปแบบวันที่ด้วยตัวเอง
setdate กำหนดวันที่แสดงตอนเริ่มต้น ***
date_move แสดง calendar ตามวันที่กำหนด
  date_move("d", จำนวนวันที่เลื่อน)
  date_move("m", จำนวนเดือนที่เลื่อน)
  date_move("y", จำนวนปีที่เลื่อน)
display สร้าง calendar. ***
expand แสดง calendar
compress ซ่อน calendar

//Event
onCreate อีเวนต์เมื่อมีการเรียก "display()"
onExpand อีเวนต์เมื่อมีการเรียก "Expand()"
onCompress อีเวนต์เมื่อมีการเรียก "compress()"
onPropertiesUpdated อีเวนต์เมื่อมีการเปลี่ยนแปลง Property
onYearSwitchClick อีเวนต์เมื่อคลิกที่ ปี
onMonthSwitchClick อีเวนต์เมื่อคลิกที่ เดือน
onValueChange อีเวนต์เมื่อการเปลี่ยนแปลงวันที่
onDayClick อีเวนต์เมื่อคลิกที่ วันที่

คำแนะนำ สำหรับผู้ที่ต้องการใช้เป็น UTF-8 ให้ทำการ Save As ไฟล์ calendar.js ให้เป็น UTF-8 ได้เลยครับ ก็จะสามารถใช้งานกับเพจที่เป็น UTF-8 ได้
rar (1,132)

ตัวอย่างการใช้งาน

<script language="javascript" src="calendar.js"></script>
<script>
  var cal1 = new gcalendar();
  cal1.name = "cal1"
  cal1.dateformat = "dd/mm/yy";
  cal1.display();
  cal1.setdate(20,11,2549,true);
  cal1.onValueChange=function () { //เหตุการณ์เมื่อ user เลือกวันที่
    cal_date.value=cal1.value //ค่าวันที่ที่คืนกลับ (แบบเต็ม)
    date.value=cal1.day //ค่าวันที่
    month.value=cal1.month //ค่าเดือน
    year.value=cal1.year+543 //ค่าปี(คศ.) + 543
  }
</script>

<br />ว/ด/ป : <input type="text" name="cal_date">
<br />วันที่ : <input type="text" name="date">
<br />เดือน : <input type="text" name="month">
<br />พศ. : <input type="text" name="year">


ตัวอย่างการส่งค่าผ่านฟอร์ม

<?
  echo $_POST[cal];
?>
<script type="text/javascript" src="calendar.js"></script>
<form action="?" method="post">
<script type="text/javascript">
    var cal = new gcalendar();
    cal.name = "cal";
    cal.dateformat = "dd/mm/yy";
    cal.display();
    cal.setdate( <?=date( "d" )?> , <?=date( "m" )?> , <?=( date( "Y" ) + 543 ) ?> , true ); //กำหนดวันที่วันนี้
</script>

<input type="submit" name="submit" value="Submit." />
</form>
ผู้เขียน goragod โพสต์เมื่อ 19 ก.ย. 2554 เปิดดู 25,460 ป้ายกำกับ PHPJavascript
^