PHP CI MANIA : ตอนที่ 11 วิธีสร้างแบบฟอร์มบันทึกข้อมูลแบบ Master - Detail เพิ่ม/ลบ/แก้ไข รายการย่อยได้
การสร้างแบบฟอร์มแบบ Master & Detail ก็คือการทำงานกับตาราง 2 ตาราง โดยที่จะมีการบันทึกข้อมูลหลักส่วนที่ 1 และมีแบบฟอร์มสำหรับบันทึกข้อมูลรายการ ในส่วนที่ 2 ดังภาพ
ส่วนของการตั้งค่าจะอยู่ในแท็ป "ตั้งค่า" ส่วนที่ 4 ด้านล่างสุด "ข้อมูลตารางรายการ (Detail)"
1. เลือกตารางที่จะใช้บันทึกรายการ เช่นหน้าเว็บนี้คือการบันทึกประวัติ Resume ดังนั้นก็จะมีตารางเก็บผลงานต่างๆ นั่นก็คือตาราง tb_portfolio ที่เลือกในภาพ
2. จะปรากฏข้อมูลฟิลด์ของตารางที่เลือกเพิ่มมาด้านล่าง
3. ดูในส่วนของตารางหลัก (Master) ใน tb_resume จะมีฟิลด์ที่เป็น Primary Key ชื่อว่า resume_id ดังที่เลือกไว้ในภาพ
4. จากนั้นก็ย้ายมาด้านตารางรายการ (Detail) เราจะต้องเลือก Foreign Key หรือง่ายๆก็คือ เลือกฟิลด์ที่เราจะเอาไอดีของตารางหลัก มาใส่อ้างอิงในแต่ละรายการนั่นเอง
5. หลังจากนั้นก็กำหนดรูปแบบช่อง INPUT เหมือนกับที่กำหนดให้ตารางหลัก ในบทที่ผ่านๆมา คือ ช่องวันที่ ช่องอัพโหลดไฟล์ ช่องตัวเลข หรือการ JOIN ต่างๆ
8. หลังจากที่เพิ่มข้อมูลเสร็จเรียบร้อย เมื่อกดย้อนกลับไปในข้อที่ 6 จะปรากฏรายการต่างๆที่ได้เพิ่มไว้ และเมื่อคลิกที่ปุ่ม "รายละเอียด" จะปรากฏตารางรายละเอียดที่ประกอบด้วย 2 ส่วนคือ
1) Resume ข้อมูลประวัติ <= Master
2) Portfolio รายการผลงานต่างๆ <= Detail
9. เมื่อกดย้อนกลับไปหน้าหลักข้อที่ 6 แล้วลองกดปุ่ม "แก้ไข" จะปรากฏแบบฟอร์มดังภาพ
ดูคลิปวิดีโอแนะนำได้ที่นี่
<< กำหนดการรับค่าให้กับช่องป้อนข้อมูล การตรวจสอบสิทธิ์ก่อนเข้าใช้งาน (LOGIN) »
ส่วนของการตั้งค่าจะอยู่ในแท็ป "ตั้งค่า" ส่วนที่ 4 ด้านล่างสุด "ข้อมูลตารางรายการ (Detail)"
1. เลือกตารางที่จะใช้บันทึกรายการ เช่นหน้าเว็บนี้คือการบันทึกประวัติ Resume ดังนั้นก็จะมีตารางเก็บผลงานต่างๆ นั่นก็คือตาราง tb_portfolio ที่เลือกในภาพ
2. จะปรากฏข้อมูลฟิลด์ของตารางที่เลือกเพิ่มมาด้านล่าง
3. ดูในส่วนของตารางหลัก (Master) ใน tb_resume จะมีฟิลด์ที่เป็น Primary Key ชื่อว่า resume_id ดังที่เลือกไว้ในภาพ
4. จากนั้นก็ย้ายมาด้านตารางรายการ (Detail) เราจะต้องเลือก Foreign Key หรือง่ายๆก็คือ เลือกฟิลด์ที่เราจะเอาไอดีของตารางหลัก มาใส่อ้างอิงในแต่ละรายการนั่นเอง
5. หลังจากนั้นก็กำหนดรูปแบบช่อง INPUT เหมือนกับที่กำหนดให้ตารางหลัก ในบทที่ผ่านๆมา คือ ช่องวันที่ ช่องอัพโหลดไฟล์ ช่องตัวเลข หรือการ JOIN ต่างๆ
6. หลังจากนั้นให้คลิกสร้างไฟล์ Models, Views, JS และ Controller ให้เรียบร้อย แล้วคลิกลิงค์เพื่อดูตัวอย่าง จะพบกับหน้าเว็บ Resume ที่เราสร้างเอาไว้
7. คลิกเข้าไปที่ "เพิ่มรายการใหม่" จะเข้าสู่แบบฟอร์มเพิ่มข้อมูล เมื่อกรอกข้อมูลจนครบถ้วน และกดบันทึกเรียบร้อย จะปรากฏปุ่มเพิ่มรายการที่ด้านข้าง จะสามารถกดเพิ่มรายการผลงานต่างๆได้เรื่อยๆ
8. หลังจากที่เพิ่มข้อมูลเสร็จเรียบร้อย เมื่อกดย้อนกลับไปในข้อที่ 6 จะปรากฏรายการต่างๆที่ได้เพิ่มไว้ และเมื่อคลิกที่ปุ่ม "รายละเอียด" จะปรากฏตารางรายละเอียดที่ประกอบด้วย 2 ส่วนคือ
1) Resume ข้อมูลประวัติ <= Master
2) Portfolio รายการผลงานต่างๆ <= Detail
9. เมื่อกดย้อนกลับไปหน้าหลักข้อที่ 6 แล้วลองกดปุ่ม "แก้ไข" จะปรากฏแบบฟอร์มดังภาพ
ดูคลิปวิดีโอแนะนำได้ที่นี่
<< กำหนดการรับค่าให้กับช่องป้อนข้อมูล การตรวจสอบสิทธิ์ก่อนเข้าใช้งาน (LOGIN) »
ความคิดเห็น
แสดงความคิดเห็น