คือว่า เรียนตามตรงเลยว่า ตอนนี้ผมกำลังพัฒนาโปรเจ็คจบอยู่ครับ
มีอยู่ระบบนึงในนั้นที่ผมตั้งใจว่าจะทำเป็น Quiz และในหน้าผมจะทำดังนี้
1. เมื่อผู้ใช้ใส่ข้อมูลลงในฟอร์มตั้งคำถามพร้อมช้อยเสร็จ หลังจากกดเพิ่มคำถาม
หน้าที่แสดงฟอร์มกรอกข้อมูล ต้องไม่่ถูกรีเฟรช (ส่งไปเฉพาะพารามิเตอร์)
2.ในหน้าสำหรับเพิ่มคำถามลงฐานข้อมูล ข้อมูลจะถูกนำไปเก็บไว้ในอาเรย์ก่อน เพื่อใช้ public ทีหลัง
3. ในหน้าแสดงคำถามต้องแสดงคำถามที่เพิ่งเพิ่มเข้าไปใหม่ และมีปุ่มสามารถลบได้หากไม่ต้องการ
สำหรับเทคนิคที่ผมเล็งไว้คือการใช้ iframe เข้าช่วยคือ จะแบ่งหน้าออกเป็น 3 หน้า หน้าแรกจะเป็นหน้าที่มี iframe สองตัว ตัวแรกโชว์ฟอร์มของการเพิ่มคำถาม ส่วนอีกกล่องโชว์หน้าที่แสดงข้อมูลคำถามที่เพิ่มแล้ว แต่ติดปัญหาตรงที่ว่า
เมื่อมีการเพื่มคำถามเข้าไป ความสูงของหน้าที่แสดงรายการคำถามจะต้องยืดตาม แต่ iframe ที่อยู่หน้า main จะไม่ยืดตาม เพราะไม่ได้ถูกรีเฟรชด้วย จริงมั้ยครับ ถ้าผมกำหนด iframe กล่องนี้ให้ overflow = scroll ก็จะทำให้หน้าตาไม่สวยดูเกะกะลูกตา เพราะฉะนั้นคิดว่าคงรู้กันแล้วว่าผมต้องการอะไร
ใช่แล้วครับ ผมอยากได้กล่อง iframe ที่สามารถยืดได้หดได้ตามขนาดของหน้าที่เราไปจั๊มป์เค้ามานั่นเอง ซึ่งผมคิดว่ามันจะลำบากไปรึเปล่าหากเทียบกับวิธีที่สอง คือ กำหนดช่อง input ให้เท่ากับจำนวนคำถามที่ผู้ใช้เลือกเข้ามาก่อนถึงหน้านี้ เช่น หากผู้ใช้เลือกสร้างแบบ 10 คำถาม ผมก็ให้ PHP วนลูปเลย สร้างฟอร์มสำหรับกรอกคำถามและตัวเลือกแบบ 10 คำถามในหน้าเดียวเลย แต่ผมว่าวิธีนี้ถึงจะทำได้ง่าย แต่มันไม่มีความดึงดูดใจเท่าวิธีแรกเลยครับ เหมือนเวลาที่เราอัพโหลดคลิปในยูทูป หากต้องการเพิ่มคลิปใหม่ต่อไปแค่กดปุ่มเพิ่มมันจะแอดเครื่องมือตัวใหม่มาให้เลย และ Fade ได้สวยงามมากครับ
เหตุที่ผมต้องมาปรึกษาที่นี่ เพราะผมยังเป้นผู้ใหม่กับภาษา jquery อยู่ อ่านหนังสือก็ไม่ค่อยเข้าใจ เค้าสอนแบบสับไปสับมา เลยต้องมาหาที่ปรึกษาเพิ่มเติมนี้แหละครับ
ผมไม่ขอโค้ดอะไรมากมาย ขอแค่กล่องไอเฟรมที่ยืดหดได้ตามที่ผมได้กล่าวข้างบน ซึ่งหากเขียนให้ได้ก็ขอขอบพระคุณล่วงหน้า แต่ถ้าเห็นว่ามีวิธีที่ดีกว่าก็ช่วยแนะนำด้วยนะครับ
อ้อ ผมไปได้ตัวอย่างของโค้ดมา อยากให้ท่านที่รู้วิธีช่วยทำให้ตัวอย่างนี้มีการค่อย ๆ เพิ่มความสูงให้หน่อยนะครับ แบบว่าอันนี้มันเพิ่มขนาดได้จริง แต่ยังไม่สวยก็เลยอยากให้ช่วยเพิ่มเรื่อง timer ให้ด้วยนะครับขอบคุณครับ
ควรออกแบบหน้านี้ด้วย jQuery ยังไงครับ
Moderator: mindphp
-
- PHP Newbie
- โพสต์: 2
- ลงทะเบียนเมื่อ: 03/03/2012 8:59 pm
-
- PHP Super Member
- โพสต์: 480
- ลงทะเบียนเมื่อ: 25/01/2010 11:57 pm
- ติดต่อ:
Re: ควรออกแบบหน้านี้ด้วย jQuery ยังไงครับ
ใช้ Ajax ดีกว่าครับอย่าไปใช้ iframe เลยถ้าไม่จำเป็น แทนที่จะโหลดเฉพาะข้อมูลที่จำเป็นแต่คุณต้องโหลดทั้งหน้า ของ iframe แต่ละอัน ถ้าหน้านึงมี 3 block ก็เท่ากับโหลดหน้า 3 หน้าโดยไม่จำเป็นหน้าที่แสดงฟอร์มกรอกข้อมูล ต้องไม่่ถูกรีเฟรช (ส่งไปเฉพาะพารามิเตอร์)
Ajax ของ Jquery ก็ใช้งานง่ายๆครับ แต่การแสดงข้อมูลหรือการเปลี่ยนแปลง หรือเปลี่ยนรูปแบบข้อมูลต่างๆ คุณอาจจะต้องใช้พวก CSS เข้ามาใช้งานด้วย
ปัจจุบันผมใช้ iframe เฉพาะ upload รูปเพราะว่า Javascript ไม่สามารถส่งข้อมูลที่เป็น Binary แบบ Ajax ได้ ก็ใช้วิธีซ่อน iframe ไว้แล้วก็ส่งข้อมูล upload ไปผ่านทาง iframe ให้อีกหน้าประมวลผล แค่นี้ ส่วนอื่นๆไม่ได้นำมาใช้เลย
-
- PHP Newbie
- โพสต์: 2
- ลงทะเบียนเมื่อ: 03/03/2012 8:59 pm
Re: ควรออกแบบหน้านี้ด้วย jQuery ยังไงครับ
อืมขอบคุณมาก ๆ ครับ ก็จริงอย่างที่ว่า มันมีทั้งข้อดีและข้อด้อยจริงๆ
-
- Similar Topics
- ตอบกลับ
- แสดง
- โพสต์ล่าสุด
-
-
โพสต์ใหม่ ถาม jQuery jQuery.get() กับ jQuery.post() ใน ajax
โดย jay_limm » 18/06/2014 2:15 pm » ใน JavaScript & jQuery Ajax & Node.JS - 2 ตอบกลับ
- 5499 แสดง
-
โพสต์ล่าสุด โดย jay_limm
18/06/2014 2:48 pm
-
-
-
โพสต์ใหม่ การใช้งาน JQUERY ในการแก้ไข Element ต่างๆโดยการเรียกด้วย method jquery
โดย ewqolf » 24/01/2023 12:45 pm » ใน jQuery & Ajax Knowledge - 1 ตอบกลับ
- 844 แสดง
-
โพสต์ล่าสุด โดย mindphp
24/01/2023 1:15 pm
-
-
-
โพสต์ใหม่ ต้องการให้ Jquery กด ปุ๋มให้เรา jQuery(selector).submit(); เเต่มันไม่ทำงาน
โดย thatsawan » 21/09/2015 10:32 pm » ใน JavaScript & jQuery Ajax & Node.JS - 4 ตอบกลับ
- 3583 แสดง
-
โพสต์ล่าสุด โดย Keyboardslo
27/01/2016 3:59 pm
-
-
-
โพสต์ใหม่ JQuery Tips : เมธอด hover() กำหนดฟังก์ชันเมื่อมีการชี้เม้าส์ ใน Jquery
โดย abdkode » 27/03/2019 2:26 pm » ใน jQuery & Ajax Knowledge - 0 ตอบกลับ
- 3085 แสดง
-
โพสต์ล่าสุด โดย abdkode
27/03/2019 2:26 pm
-
-
-
โพสต์ใหม่ สร้างปฏิทินด้วยฟังก์ชันใน jQuery
โดย theoneozz » 10/01/2019 4:01 pm » ใน jQuery & Ajax Knowledge - 0 ตอบกลับ
- 4669 แสดง
-
โพสต์ล่าสุด โดย theoneozz
10/01/2019 4:01 pm
-
-
-
โพสต์ใหม่ การทำรูปภาพให้ซูมได้ด้วย Jquery
โดย Parichat » 26/06/2018 12:02 pm » ใน jQuery & Ajax Knowledge - 0 ตอบกลับ
- 2789 แสดง
-
โพสต์ล่าสุด โดย Parichat
26/06/2018 12:02 pm
-
-
- 0 ตอบกลับ
- 1456 แสดง
-
โพสต์ล่าสุด โดย Ik Kat
29/06/2017 2:35 pm
-
- 0 ตอบกลับ
- 1116 แสดง
-
โพสต์ล่าสุด โดย sonram
11/07/2016 6:32 pm
ผู้ใช้งานขณะนี้
สมาชิกกำลังดูบอร์ดนี้: ไม่มีสมาชิกใหม่ และบุคลทั่วไป 22