Forgot Password ??

PHP , ASP , ASP.NET, VB.NET, C#, Java , jQuery , Android , iOS , Windows Phone

	Registered : 109,037

HOME > PHP > PHP Forum > ขอ code ที่โช calender เวลาที่จะก็อกข้อมูลลงไน textbox นะคะ

ขอ code ที่โช calender เวลาที่จะก็อกข้อมูลลงไน textbox นะคะ

เริ่มหัวข้อใหม่

Cat

โพสกระทู้ ( 216 )
บทความ ( 0 )

คือว่าเวลาที่จะก็อกข้อมูนลง database คะ

Code

แล้วเวลาที่จะเมื่อclick ที่ text นี้ก็จะมี calender ขี้นมาไห้เราเลือกเอาคะ เมื่อเลือกแล้ววันเดือนปีก็จะเข้าไปอยู่ไน Text นี้คะ

คือว่าไม่อยากจะเขียนเอง 2012/05/31

Tag : PHP, MySQL

Date : 2012-06-12 11:00:23

By : Cat

View : 1325

Reply : 23

No. 1

โปรแกรมมั่ว

โพสกระทู้ ( 437 )
บทความ ( 3 )

datepicker ของ jquery ui ครับ

Date : 2012-06-12 11:05:23

By : randOmizE

No. 2

Cat

โพสกระทู้ ( 216 )
บทความ ( 0 )

ตอบความคิดเห็นที่ : 1 เขียนโดย : randOmizE เมื่อวันที่ 2012-06-12 11:05:23

รายละเอียดของการตอบ ::

... งง..มีตวอย่างบ่อ.....

Date : 2012-06-12 11:36:36

By : Cat

No. 3

TC Admin

โพสกระทู้ ( 74,058 )
บทความ ( 838 )

มีหลายตัวครับ ถ้าทันสมัย ๆ ก็ jQuery ถ้าเก่า ๆ ก็ใช้ JavaScript ธรรมดาครับ

Go to : Javascript Calendar Date Picker

Date : 2012-06-12 11:38:53

By : mr.win

No. 4

Cat

โพสกระทู้ ( 216 )
บทความ ( 0 )

ตอบความคิดเห็นที่ : 3 เขียนโดย : mr.win เมื่อวันที่ 2012-06-12 11:38:53

รายละเอียดของการตอบ ::

... ขอบใจหลายฯฯ แต่ดาวโหลดไปแล้วใช้ย่างไรคะ
......

Date : 2012-06-12 13:42:01

By : Cat

No. 5

TC Admin

โพสกระทู้ ( 74,058 )
บทความ ( 838 )

มันมี Demo อยู่น่ะครับ

Date : 2012-06-12 13:57:40

By : mr.win

No. 6

Cat

โพสกระทู้ ( 216 )
บทความ ( 0 )

ตอบความคิดเห็นที่ : 5 เขียนโดย : mr.win เมื่อวันที่ 2012-06-12 13:57:40

รายละเอียดของการตอบ ::

... งงคะพี่ วิน บอกละเอียดเลียได้บ่อคะ คือว่ามันมี

แต่ไม่รู้ว่าจะเอาไปใส่ส่วนไหนคะ

// Title: Timestamp picker
// Description: See the demo at url
// URL: http://us.geocities.com/tspicker/
// Script featured on: http://javascriptkit.com/script/script2/timestamp.shtml
// Version: 1.0
// Date: 12-05-2001 (mm-dd-yyyy)
// Author: Denis Gritcyuk <[email protected]>; <[email protected]>
// Notes: Permission given to use this script in any kind of applications if
//    header lines are left unchanged. Feel free to contact the author
//    for feature requests and/or donations

function show_calendar(str_target, str_datetime) {
	var arr_months = ["January", "February", "March", "April", "May", "June",
		"July", "August", "September", "October", "November", "December"];
	var week_days = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"];
	var n_weekstart = 1; // day week starts from (normally 0 or 1)

	var dt_datetime = (str_datetime == null || str_datetime =="" ?  new Date() : str2dt(str_datetime));
	var dt_prev_month = new Date(dt_datetime);
	dt_prev_month.setMonth(dt_datetime.getMonth()-1);
	var dt_next_month = new Date(dt_datetime);
	dt_next_month.setMonth(dt_datetime.getMonth()+1);
	var dt_firstday = new Date(dt_datetime);
	dt_firstday.setDate(1);
	dt_firstday.setDate(1-(7+dt_firstday.getDay()-n_weekstart)%7);
	var dt_lastday = new Date(dt_next_month);
	dt_lastday.setDate(0);
	
	// html generation (feel free to tune it for your particular application)
	// print calendar header
	var str_buffer = new String (
		"<html>\n"+
		"<head>\n"+
		"	<title>Calendar</title>\n"+
		"</head>\n"+
		"<body bgcolor=\"White\">\n"+
		"<table class=\"clsOTable\" cellspacing=\"0\" border=\"0\" width=\"100%\">\n"+
		"<tr><td bgcolor=\"#4682B4\">\n"+
		"<table cellspacing=\"1\" cellpadding=\"3\" border=\"0\" width=\"100%\">\n"+
		"<tr>\n	<td bgcolor=\"#4682B4\"><a href=\"javascript:window.opener.show_calendar('"+
		str_target+"', '"+ dt2dtstr(dt_prev_month)+"'+document.cal.time.value);\">"+
		"<img src=\"prev.gif\" width=\"16\" height=\"16\" border=\"0\""+
		" alt=\"previous month\"></a></td>\n"+
		"	<td bgcolor=\"#4682B4\" colspan=\"5\">"+
		"<font color=\"white\" face=\"tahoma, verdana\" size=\"2\">"
		+arr_months[dt_datetime.getMonth()]+" "+dt_datetime.getFullYear()+"</font></td>\n"+
		"	<td bgcolor=\"#4682B4\" align=\"right\"><a href=\"javascript:window.opener.show_calendar('"
		+str_target+"', '"+dt2dtstr(dt_next_month)+"'+document.cal.time.value);\">"+
		"<img src=\"next.gif\" width=\"16\" height=\"16\" border=\"0\""+
		" alt=\"next month\"></a></td>\n</tr>\n"
	);

	var dt_current_day = new Date(dt_firstday);
	// print weekdays titles
	str_buffer += "<tr>\n";
	for (var n=0; n<7; n++)
		str_buffer += "	<td bgcolor=\"#87CEFA\">"+
		"<font color=\"white\" face=\"tahoma, verdana\" size=\"2\">"+
		week_days[(n_weekstart+n)%7]+"</font></td>\n";
	// print calendar table
	str_buffer += "</tr>\n";
	while (dt_current_day.getMonth() == dt_datetime.getMonth() ||
		dt_current_day.getMonth() == dt_firstday.getMonth()) {
		// print row heder
		str_buffer += "<tr>\n";
		for (var n_current_wday=0; n_current_wday<7; n_current_wday++) {
				if (dt_current_day.getDate() == dt_datetime.getDate() &&
					dt_current_day.getMonth() == dt_datetime.getMonth())
					// print current date
					str_buffer += "	<td bgcolor=\"#FFB6C1\" align=\"right\">";
				else if (dt_current_day.getDay() == 0 || dt_current_day.getDay() == 6)
					// weekend days
					str_buffer += "	<td bgcolor=\"#DBEAF5\" align=\"right\">";
				else
					// print working days of current month
					str_buffer += "	<td bgcolor=\"white\" align=\"right\">";

				if (dt_current_day.getMonth() == dt_datetime.getMonth())
					// print days of current month
					str_buffer += "<a href=\"javascript:window.opener."+str_target+
					".value='"+dt2dtstr(dt_current_day)+"'+document.cal.time.value; window.close();\">"+
					"<font color=\"black\" face=\"tahoma, verdana\" size=\"2\">";
				else 
					// print days of other months
					str_buffer += "<a href=\"javascript:window.opener."+str_target+
					".value='"+dt2dtstr(dt_current_day)+"'+document.cal.time.value; window.close();\">"+
					"<font color=\"gray\" face=\"tahoma, verdana\" size=\"2\">";
				str_buffer += dt_current_day.getDate()+"</font></a></td>\n";
				dt_current_day.setDate(dt_current_day.getDate()+1);
		}
		// print row footer
		str_buffer += "</tr>\n";
	}
	// print calendar footer
	str_buffer +=
		"<form name=\"cal\">\n<tr><td colspan=\"7\" bgcolor=\"#87CEFA\">"+
		"<font color=\"White\" face=\"tahoma, verdana\" size=\"2\">"+
		"Time: <input type=\"text\" name=\"time\" value=\""+dt2tmstr(dt_datetime)+
		"\" size=\"8\" maxlength=\"8\"></font></td></tr>\n</form>\n" +
		"</table>\n" +
		"</tr>\n</td>\n</table>\n" +
		"</body>\n" +
		"</html>\n";

	var vWinCal = window.open("", "Calendar", 
		"width=200,height=250,status=no,resizable=yes,top=200,left=200");
	vWinCal.opener = self;
	var calc_doc = vWinCal.document;
	calc_doc.write (str_buffer);
	calc_doc.close();
}
// datetime parsing and formatting routimes. modify them if you wish other datetime format
function str2dt (str_datetime) {
	var re_date = /^(\d+)\-(\d+)\-(\d+)\s+(\d+)\:(\d+)\:(\d+)$/;
	if (!re_date.exec(str_datetime))
		return alert("Invalid Datetime format: "+ str_datetime);
	return (new Date (RegExp.$3, RegExp.$2-1, RegExp.$1, RegExp.$4, RegExp.$5, RegExp.$6));
}
function dt2dtstr (dt_datetime) {
	return (new String (
			dt_datetime.getDate()+"-"+(dt_datetime.getMonth()+1)+"-"+dt_datetime.getFullYear()+" "));
}
function dt2tmstr (dt_datetime) {
	return (new String (
			dt_datetime.getHours()+":"+dt_datetime.getMinutes()+":"+dt_datetime.getSeconds()));
}

.....
.

Date : 2012-06-12 14:11:47

By : Cat

No. 7

deawx

โพสกระทู้ ( 5,149 )
บทความ ( 26 )

https://www.thaicreate.com/community/jquery-ui-datepicker-onselect.html เบิ่งหม่องนี่จ้า

Date : 2012-06-12 14:24:32

By : deawx

No. 8

deawx

โพสกระทู้ ( 5,149 )
บทความ ( 26 )

Code (PHP)

<!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>Datepicker</title>

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/themes/cupertino/jquery-ui.css" type="text/css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.13/jquery-ui.min.js"></script>
<script>
$(function() {
	$("#datepicker").datepicker();
});
</script>
</head>

<body>
<input type="text" name="datepicker" id="datepicker" value="" />
</body>
</html>

ประวัติการแก้ไข
2012-06-12 14:28:04

Date : 2012-06-12 14:27:27

By : deawx

No. 9

Cat

โพสกระทู้ ( 216 )
บทความ ( 0 )

ตอบความคิดเห็นที่ : 8 เขียนโดย : deawx เมื่อวันที่ 2012-06-12 14:27:27

รายละเอียดของการตอบ ::

... มันมี 2 text แบบนี้คะ อ้ายด่ฯว
<tr>
<td class="tbl1" style="white-space: nowrap;"><div align="right">ເລີ່ມຕົ້ນ : </div></td>
<td class="tbl1" style="white-space: nowrap;"><span class="tbl1" style="white-space: nowrap;">
<input name="textEffectTime" type="text" id="textEffectTime" style="border-color:#BFFFBF" size="50" />
</span></td>
</tr>
<tr>
<td class="tbl1" style="white-space: nowrap;"><div align="right">ໝົດອາຍຸ : </div></td>
<td class="tbl1" style="white-space: nowrap;"><span class="tbl1" style="white-space: nowrap;">
<input name="textExpireTime" type="text" id="textExpireTime" style="border-color:#BFFFBF" size="50" />
</span></td>
</tr>

เรัดแบบอ้ายบอกแล้ว มันได้แต่ text ตัวที่1 ตัวที่ 2ไม่ได้คะ......

Date : 2012-06-12 14:57:21

By : Cat

No. 10

grandraft

โพสกระทู้ ( 545 )
บทความ ( 0 )

จากของคุณ deawx แก้เป้นแบบนี้
Code (JavaScript)

<script>
$(function() {
	$("#textEffectTime").datepicker();
        $("#textExpireTime").datepicker();
});
</script>

ผมไม่แน่้ใจว่าเอา name หรือ id มาใช้ในการเรียก function datepicker นะครับ ต้องลองทดสอบดู

Date : 2012-06-12 15:13:44

By : grandraftz

No. 11

Guest

ใช้ไอดีในการเรียกใช้ function ครับ

Date : 2012-06-12 15:36:42

By : บังเอิญผ่านมาเห็น

No. 12

Anu

โพสกระทู้ ( 768 )
บทความ ( 0 )

Code (JavaScript)

<script>
$(function() {
     $("#textEffectTime").datepicker();
     $("#textExpireTime").datepicker();
});
</script>

textbox ตัวไหนต้องการใช้ datepicker ก็เอา id มาใส่
เพิ่มไปเรื่อยๆครับ
-อันนี้เป็นแบบใช้ค่า default ของ datepicker ถ้าต้องการ config อะไรก็ลองดุในตัวอย่างได้เลยครับ

Date : 2012-06-12 16:56:42

By : naskw

No. 13

Anu

โพสกระทู้ ( 768 )
บทความ ( 0 )

ตัวอย่างอยุ่ตรงนี้
มีโค้ดตัวอย่างด้วยนะ ตรงลิ้ง view source ข้างล่างตัวอย่างอะ ลองแกะดู

Date : 2012-06-12 16:59:34

By : naskw

No. 14

Cat

โพสกระทู้ ( 216 )
บทความ ( 0 )

ตอบความคิดเห็นที่ : 12 เขียนโดย : naskw เมื่อวันที่ 2012-06-12 16:56:42

รายละเอียดของการตอบ ::

... เวลาจะก็อกข้อมูลก็เหัน calender ไห้เลือกแล้วคะ แต่ทำไหมเวลา add ลง database มันกรายเป็น 0000:00:00 อย่างนี้คะ
ทำไหมมันไม่ออก เป็นตัวเลกที่เลือกไน calendar คะ
กำหนดใน database เป็น Date(20) คะ......

Date : 2012-06-12 17:22:09

By : Cat

No. 15

Guest

ลองเปลี่ยนจาก Date(20) เป็น varchar ดูว่าใช้ได้ไหม

Date : 2012-06-12 19:11:11

By : บังเอิญผ่านมาเห็น

No. 16

Anu

โพสกระทู้ ( 768 )
บทความ ( 0 )

ตอบความคิดเห็นที่ : 14 เขียนโดย : Cat เมื่อวันที่ 2012-06-12 17:22:09

รายละเอียดของการตอบ ::

ตรงนี้มีสองเรื่องที่ต้องทำความเข้าใจนะครับ
1.database mysql จะเก็บวันที่ในฟอร์แมท YYYY-MM-DD
2.datepicker ฟอร์แมท ตอนที่เลือกวันที่ตอนเลือกตรงกับข้อ 1. หรือเปล่า
ลองไล่ดูดีๆครับ หรือไม่ก็ echo คำสั่ง sql ออกมาดูว่าวันที่มันถูกต้องหรือเปล่า

*เพิ่มเติมนะครับ
วันที่ที่ได้จาก datepicker มันจะเป็นแบบนี้ 06/01/2012 ลอง setformat แบบนี้ดูครับ
Code (JavaScript)

     $( "#textboxID" ).datepicker( "option", "dateFormat","yy-mm-dd");

ประวัติการแก้ไข
2012-06-13 09:35:01

Date : 2012-06-13 09:30:13

By : naskw

No. 17

Cat

โพสกระทู้ ( 216 )
บทความ ( 0 )

ตอบความคิดเห็นที่ : 16 เขียนโดย : naskw เมื่อวันที่ 2012-06-13 09:30:13

รายละเอียดของการตอบ ::

... มันยังไม่ได้เลียคะ ...database mysql จะเก็บวันที่ในฟอร์แมท YYYY-MM-DD..แต่ใน datepicker MM-DD-YYYY ลองแก้แบบคุญบอกแล้วมันไม่เห็น calendar ขี้นไห้เลือกเลียคะ

ต้องแก้อย่างใรคะ

Date : 2012-06-13 15:07:07

By : Cat

No. 18

Guest

ตอนรับค่าจาก datepicker

มันมีแค่วันที่ครับ ต้องเติมเองทีหลัง

เช่น

Code (PHP)

$var = $_POST['datepicker'].' '.date('H').':'.date('i').':'.date('s');

Date : 2012-06-13 15:12:29

By : Pine

No. 19

Cat

โพสกระทู้ ( 216 )
บทความ ( 0 )

ตอบความคิดเห็นที่ : 18 เขียนโดย : Pine เมื่อวันที่ 2012-06-13 15:12:29

รายละเอียดของการตอบ ::

... ไปไส่ต่งไหนหรอคะ ลบกวนด้วยคะ......

Date : 2012-06-13 15:24:10

By : Cat

No. 20

Anu

โพสกระทู้ ( 768 )
บทความ ( 0 )

เอาโค้ดตรง datepicker มาดูหน่อย
แล้วเอาโค้ดที่ผมให้ไปใช้ แล้วเปลี่ยน id ป่าวละดูดีๆนะครับ

Date : 2012-06-13 15:37:44

By : naskw

No. 21

Cat

โพสกระทู้ ( 216 )
บทความ ( 0 )

ช่วยดูไห้ด้วยคะ

<!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>Untitled Document</title>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/themes/cupertino/jquery-ui.css" type="text/css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.13/jquery-ui.min.js"></script>

<script>
$(function() {
$("#textStart").datepicker();
$("#textEnd").datepicker();
$( "#textboxID" ).datepicker( "option", "dateFormat","yy-mm-dd");
});
</script>
<body>
<form id="Add" name="Add" method="post" action="phpMySqlAddSave.php" onSubmit="JavaScript:return check_from();">
<table border="1" cellpadding="0" cellspacing="2" width="50%" align="center" class="style1" >
<tr>
<td height="50" colspan="0" align="center" background="images/templatemo_footer_bg.jpg" ><B><font size="4" color="#FFFFFF" >ເພີ່ມຂໍ້ມູນ Shortcode</font></B></td>
</tr>
<table border="1" cellpadding="0" cellspacing="0" width="50%" align="center" class="style1">

<tr>
<td class="tbl1" style="white-space: nowrap;"><div align="right">ຊື່ບໍລິສັດ : </div></td>
<td class="tbl1" style="white-space: nowrap;"><span class="tbl1" style="white-space: nowrap;">
<input name="textCompany" type="text" id="textCompany" style="border-color:#BFFFBF" size="50" />
</span></td>
</tr>
<tr>
<td class="tbl1" style="white-space: nowrap;"><div align="right">ເລີ່ມຕົ້ນ : </div></td>
<td class="tbl1" style="white-space: nowrap;"><span class="tbl1" style="white-space: nowrap;">
<input name="textEffectTime" type="text" id="textEffectTime" style="border-color:#BFFFBF" size="50" />
</span></td>
</tr>

Date : 2012-06-13 15:49:10

By : Cat

No. 22

Guest

Code (JavaScript)

<script>
$(function() {
$("#textStart").datepicker( "option", "dateFormat","yy-mm-dd");
$("#textEnd").datepicker( "option", "dateFormat","yy-mm-dd");
});
</script>

แต่ผมไม่เห็น input id ตามข้างบน ในฟอร์มอ่ะ ??

ถ้าเอาไปใช้ ก็ให้แทรก input ทั้งสองเข้าไปในฟอร์มครับ

<input type="text" name="textStart id="textStart" /> <input type="text" name="textEnd" id="textEnd" />

พอรับค่า ถ้าจะให้ฐานข้อมูลเก็บเวลาด้วยก็เติมเวลาเข้าไป

$textStart = $_POST['textStart'].' '.date('H:i:s');
$textEnd = $_POST['textEnd'].' '.date('H:i:s');

Date : 2012-06-13 16:07:00

By : Pine

No. 23

Cat

โพสกระทู้ ( 216 )
บทความ ( 0 )

ตอบความคิดเห็นที่ : 22 เขียนโดย : Pine เมื่อวันที่ 2012-06-13 16:07:00

รายละเอียดของการตอบ ::

... thanks too much very much......

Date : 2012-06-13 16:45:38

By : Cat

ค้นหาข้อมูล

แสดงความคิดเห็น

Re : ขอ code ที่โช calender เวลาที่จะก็อกข้อมูลลงไน textbox นะคะ

รายละเอียด

เพื่อความเรียบร้อยของข้อความ ควรจัดรูปแบบให้พอดีกับขนาดของหน้าจอ เพื่อง่ายต่อการอ่านและสบายตา และตรวจสอบภาษาไทยให้ถูกต้อง

อัพโหลดแทรกรูปภาพ

Notice

เพื่อความปลอดภัยของเว็บบอร์ด ไม่อนุญาติให้แทรก แท็ก [img]....[/img] โดยการอัพโหลดไฟล์รูปจากที่อื่น เช่นเว็บไซต์ ฟรีอัพโหลดต่าง ๆ
อัพโหลดแทรกรูปภาพ ให้ใช้บริการอัพโหลดไฟล์ของไทยครีเอท และตัดรูปภาพให้พอดีกับสกรีน เพื่อความโหลดเร็วและไฟล์ไม่ถูกลบทิ้ง

เพื่อความปลอดภัยและการตรวจสอบ กระทู้ที่แทรกไฟล์อัพโหลดไฟล์จากที่อื่น อาจจะถูกลบทิ้ง

โดย

อีเมล์

บวกค่าให้ถูก

<= ตัวเลขฮินดูอารบิก เช่น 123 (หรือล็อกอินเข้าระบบสมาชิกเพื่อไม่ต้องกรอก)

Exchange: นำเข้าสินค้าจากจีน, Taobao, เฟอร์นิเจอร์, ของพรีเมี่ยม, ร่ม, ปากกา, power bank, แฟลชไดร์ฟ, กระบอกน้ำ

Load balance : Server 00

Registered : 109,037

document.write("<font color=996600>[PHP]</font>"); ขอ code ที่โช calender เวลาที่จะก็อกข้อมูลลงไน textbox นะคะ

No. 1

No. 2

No. 3

No. 4

No. 5

No. 6

No. 7

No. 8

No. 9

No. 10

No. 11

No. 12

No. 13

No. 14

No. 15

No. 16

No. 17

No. 18

No. 19

No. 20

No. 21

No. 22

No. 23

ค้นหาข้อมูล

อัพโหลดแทรกรูปภาพ

Notice

ขอ code ที่โช calender เวลาที่จะก็อกข้อมูลลงไน textbox นะคะ