วิธีสร้างตาราง HTML Table จาก CSV File

โจทย์คือ ต้องสร้างระบบ เพื่อให้ผู้ใช้ สร้าง โครงสร้างแบบฟอร์ม ด้วย Excel แล้วต้องแปลงให้เป็น Web Page ซึ่ง จะต้องการตกแต่งด้วย Bootstrap

หน้าตาต้นแบบเป็นแบบนี้ (ในที่นี้ใช้ Google Sheets แต่ก็ทำวิธีการเดียวกันกับ MS Excel)

ถ้า ใช้วิธี Save As เป็น HTML ตรง ๆ จะได้หน้าตาประมาณนี้

ซึ่งจะยุ่งยากมาก ในการจัดการ และการควบคุมการแสดงผล

วิธีการคือ !!!

1 Save As เป็น CSV

2 เปิดเว็บ
http://www.convertcsv.com/csv-to-html.htm

3 แล้ว Upload ไฟล์ หรือจะ Copy Paste ก็ได้

4 ก็จะได้ plain HTML

5 เอาไปประกอบกับ Bootstrap ได้สบาย (ในภาพ ใช้ django template tag ด้วย เลยได้ widget ตามที่กำหนด)

หวังว่าจะเป็นประโยชน์ครับ

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.