Forgot Password ??

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

	Registered : 109,027

HOME > Client Script Forum > สอบถามการเรียกใช้ datepicker จาก src="mootools.v1.11.js ใน Dynamic Elements ด้วย javascript ค่ะ

สอบถามการเรียกใช้ datepicker จาก src="mootools.v1.11.js ใน Dynamic Elements ด้วย javascript ค่ะ

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

Guest

ได้ประยุกต์ใช้ จากบทความ สร้าง Create Dynamic Elements แบบ เพิ่ม-ลบ ได้ให้กับ Form ด้วย JavaScript ค่ะ
คือ ช่องตาราง ข้างล่างนี้ เป็นช่องที่ให้ ผู้ใช้เลือกวันที่ และอยากให้ขึ้น pop up ปฏิทิน อัตโนมัติค่ะ
ซึ่งจะเป็นช่องที่เพิ่มขึ้นเรื่อยๆ เมื่อ ผู้ใช้กดเพิ่ม

Code

//*** Column 1 ***//
newCell = newRow.insertCell(0);
newCell.id = newCell.uniqueID;
newCell.setAttribute("className", "css-name");
newCell.innerHTML = "<center><INPUT TYPE=\"TEXT\" SIZE=\"5\" NAME=\"Column1_"+intLine+"\" ID=\"Column1_"+intLine+"\" VALUE=\"\"></center>";

โดยถ้าเป็น input form ธรรมดา ก็เรียกใช้ DatePicker ได้ปกติ เช่น

Code

<head>
<script type="text/javascript" src="mootools.v1.11.js"></script>
<script type="text/javascript" src="DatePicker_Bud.js"></script>
<link rel="stylesheet" href="DatePicker.css" />
</head>
// calendar
window.addEvent('domready', function()
{

$$('input.DatePicker').each( function(el)
{
new DatePicker(el);
});
});

ส่วนที่ form ก็จะเรียกใช้ ดังนี้ค่ะ

Code

แต่ลองมาปรับใช้ กับ dynamic form ดังนี้

Code

newCell.innerHTML = "<center><INPUT TYPE=\"TEXT\" SIZE=\"5\" NAME=\"Column1_"+intLine+"\" ID=\"Column1_"+intLine+"\" VALUE=\"\" class="\DatePicker\"+inline+"></center>";

กลับใช้ไม่ได้ค่ะ ขอคำแนะนำ หน่อยนะค่ะ พอดีเพิ่งหัดเขียนค่ะ

Tag : HTML/CSS, JavaScript

Date : 2012-11-09 17:33:06

By : shushu

View : 1433

Reply : 4

No. 1

jack

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

อันนี้ผมไม่แน่ใจว่ามีคำสั่งแบบนี้หรือไม่ $$ เพราะตามที่คุณบอกว่า 'โดยถ้าเป็น input form ธรรมดา ก็เรียกใช้ DatePicker ได้ปกติ'

Code (JavaScript)

$$('input.DatePicker').each( function(el)

ผมมีตัวอย่างโค้ด Date Picker ของ jQuery UI ลองไปดาวโหลดมาทดสอบดูได้ครับ ตามลิงค์ข้างล่างนี้

http://mineinc.net/qa/file/2012/11/9.2/file1.html

อาจช่วยแ้ก้ไขปัญหาได้

Date : 2012-11-10 21:13:49

By : dreamlover

No. 2

Guest

จะเรียกใช้ js ใน javascript ได้ไหมค่ะ คือ code javascript เป็นดังนี้ค่ะ

ตัวอย่างจากบทความ จากบทความ สร้าง Create Dynamic Elements แบบ เพิ่ม-ลบ ได้ให้กับ Form ด้วย JavaScript

Code (JavaScript)

<script language="javascript">

	function CreateNewRow()
	{
		var intLine = parseInt(document.frmMain.hdnMaxLine.value);
		intLine++;
			
		var theTable = document.getElementById("tbExp");
		var newRow = theTable.insertRow(theTable.rows.length)
		newRow.id = newRow.uniqueID

		var newCell
		
		//*** Column 1 ***//
		newCell = newRow.insertCell(0);
		newCell.id = newCell.uniqueID;
		newCell.setAttribute("className", "css-name");
		newCell.innerHTML = "<center><INPUT TYPE=\"TEXT\" SIZE=\"5\" NAME=\"Column1_"+intLine+"\"    ID=\"Column1_"+intLine+"\" VALUE=\"\"></center>";

</script>
<body>
<table>
  <tr>
    <td><div align="center">Column 1 </div></td>
</tr>
</table>
<body>

ซึ่งจะถามผู้ใช้ก่อนว่าต้องการเพิ่ม row กี่ row จากนั้นระบบจะ generate row ตามจำนวนที่ผู้ใช้ต้องการ แต่ปัญหาก็คือมี่ช่องนึงที่ให้ผู้ใช้เลือกวันที่ แต่ไม่รู้จะเรียกใช้ datepicker ยังไงค่ะ

Date : 2012-11-10 21:48:12

By : shushu

No. 3

jack

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

ที่คุณทำอยู่ตอนแรกถูกต้องแล้วครับ เพิ่ม class="DatePicker" เข้าไปในโค้ดด้านล่าง
จริงแล้วควรจะทำงาน ไม่ควรมีปัญหาอะไร

Code (JavaScript)

newCell.innerHTML = "<center><INPUT TYPE=\"TEXT\" SIZE=\"5\" NAME=\"Column1_"+intLine+"\" ID=\"Column1_"+intLine+"\" VALUE=\"\" class="\DatePicker\"+inline+"></center>";

เพียงแต่ลองเอาโค้ด DatePicker ที่ผมให้ไปแทนที่ของเก่า แล้วดูว่าเป็นอย่างไร
เมื่อผู้ใช้งานคลิกที่ช่องวันที่ ตัว DatePicker ควรทำงานเองโดยอัติโนมัติ
ต้่องลิงค์ไฟล์ทั้งหมดที่ผมทำไว้ให้ครบด้วยนะครับ

Date : 2012-11-10 22:08:05

By : dreamlover

No. 4

Guest

ลองทำดูแล้วค่ะ ไม่ได้เช่นกัน

Date : 2012-11-10 23:18:00

By : shushu

ค้นหาข้อมูล

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

Re : สอบถามการเรียกใช้ datepicker จาก src="mootools.v1.11.js ใน Dynamic Elements ด้วย javascript ค่ะ

รายละเอียด

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

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

Notice

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

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

โดย

อีเมล์

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