วัน: 31 มีนาคม 2021

Tabulator: data from cloneTabulator: data from clone

ในโลกของการพัฒนาแอปพลิเคชันที่ซับซ้อน การแสดงผลข้อมูลที่ถูกกรองหรือถูกเลือกโดยผู้ใช้เป็นฟังก์ชันพื้นฐานที่สำคัญอย่างยิ่ง โดยเฉพาะอย่างยิ่งเมื่อเราใช้ไลบรารีอย่าง Tabulator ในการแสดงผลตารางข้อมูลขนาดใหญ่ การโคลน (Cloning) ข้อมูลที่ถูกเลือกจากตารางหลักไปยังตารางแสดงผลรอง (Selected Rows) จึงเป็นเทคนิคที่นักพัฒนาระบบต้องทำความเข้าใจ

ในบริบทของระบบที่ใช้ PostgreSQL เป็นฐานข้อมูลหลัก แม้ว่า Tabulator จะทำงานที่ฝั่ง Frontend แต่หลักการทางตรรกะของการดึงข้อมูลที่ถูกกรองก็สามารถถูกจำลองและยืนยันประสิทธิภาพด้วยไวยากรณ์ของ SQL ได้อย่างสมบูรณ์ เราจะมาดูวิธีการจัดการข้อมูลที่ถูก ‘เลือก’ เพื่อนำไปแสดงผลในพื้นที่ใหม่ได้อย่างไร

💡 หลักการโคลนข้อมูลที่เลือก (Cloning Selected Data)

หลักการทำงานคือการระบุชุดของ Primary Keys (PK) หรือเงื่อนไขเฉพาะที่ผู้ใช้ได้โต้ตอบด้วย (เช่น การคลิกเลือกแถว) จากนั้นจึงใช้ชุดคีย์เหล่านี้เป็นตัวกรอง (Filter) ในการดึงข้อมูลชุดเดิมมาแสดงผลซ้ำในส่วนที่สองของหน้าจอ ซึ่งในทางฐานข้อมูล เราจะใช้เทคนิคที่คล้ายกับการใช้ Common Table Expressions (CTEs) หรือ Subqueries เพื่อให้การดึงข้อมูลมีประสิทธิภาพสูงสุด

⚙️ การจำลองกระบวนการด้วย PostgreSQL

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

SQL

-- 1. สมมติว่า 'selected_ids' คือรายการ ID ที่ผู้ใช้คลิกเลือก (เช่น 101, 105, 112) </code>

-- 2. ใช้ CTE (WITH) เพื่อจำลองการกรองข้อมูลที่ถูกเลือก
WITH selected_records AS (
    -- ในการใช้งานจริง ข้อมูลนี้จะมาจาก Ajax Call ที่ส่งรายการ ID มา
    SELECT 101 AS product_id, 'Apple' AS name, 10.50 AS price
    UNION ALL
    SELECT 105, 'Banana', 5.20
    UNION ALL
    SELECT 112, 'Orange', 8.00
)

-- 3. ดึงข้อมูลทั้งหมดจากตารางหลัก (product_data) ที่ตรงกับ ID ในชุดที่เลือก
SELECT 
    pd.product_id,
    pd.name,
    pd.price
FROM 
    product_data pd
JOIN 
    selected_records sr ON pd.product_id = sr.product_id;

ในตัวอย่าง SQL นี้ selected_records ทำหน้าที่เป็นเหมือน ‘ตัวกรอง’ ที่เก็บเฉพาะรายการที่ถูกเลือกเท่านั้น และเราใช้ JOIN กับตารางหลัก product_data เพื่อให้มั่นใจว่าข้อมูลที่แสดงในตารางโคลน (Clone Table) จะเป็นข้อมูลที่สมบูรณ์และถูกต้องตามเงื่อนไขการเลือกของผู้ใช้

🚀 ประโยชน์เชิงสถาปัตยกรรม (Architectural Benefits)

การใช้หลักการโคลนข้อมูลนี้มีข้อได้เปรียบหลายประการ:

  • ประสิทธิภาพ (Performance): ลดปริมาณข้อมูลที่ส่งผ่านเครือข่าย (Network Payload) โดยส่งเพียง ID ที่ถูกเลือกเท่านั้น
  • ความแม่นยำ (Accuracy): รับประกันได้ว่าข้อมูลที่แสดงในตารางโคลนเป็นชุดข้อมูลที่ผู้ใช้ยืนยันการเลือกอย่างชัดเจน
  • ความยืดหยุ่น (Scalability): สามารถขยายไปใช้กับการกรองข้อมูลที่ซับซ้อนขึ้น เช่น การเลือกตามช่วงวันที่ (Date Range) หรือสถานะ (Status) ได้ง่าย

✅ บทสรุป

การจัดการข้อมูลที่ถูกโคลนหรือถูกกรองใน Tabulator นั้น ไม่ได้เป็นเพียงแค่การคัดลอกข้อมูล แต่คือการจำลองกระบวนการ Query ข้อมูลที่แม่นยำ โดยใช้หลักการของ Primary Key และการ Join ในระดับฐานข้อมูลอย่าง PostgreSQL การทำความเข้าใจแนวคิดนี้จะช่วยให้คุณสร้างระบบที่ทั้งรวดเร็ว มีประสิทธิภาพ และมีความน่าเชื่อถือสูงในการแสดงผลข้อมูลที่ถูกคัดสรรมาอย่างดี