ใน TU3 นี้จะสอนการสร้าง templates เพิ่มแสดงหน้าเว็บ และการเชื่อมลิงค์ต่างๆของแอพ
เริ่มแรกไปที่ views.py ก็อบโค้ดตามภาพไปวางในไฟล์ของเรา โดยจะมี 3 method ดังนี้ 1.detail เป็น method ที่ใช้แสดงหน้าเว็บที่มีคำถามต่างๆของแอพ 2.results เป็น method ที่ใช้ช้อยส์ในคำถามนั้นๆ และ 3.vote ที่ใช้แสดงหน้าเว็บเมื่อกด vote เสร็จแล้ว
ต่อมาไปที่ urls.py ก็อบโค้ดตามภาพไปวางไว้ในไฟล์ของเรา โดย url จะมีลิงค์ไปที่หน้า index หน้า detail หน้า result และหน้า vote ซึ่งตรงกับชื่อ method ใน views.py
เว็บจะบอกว่า ให้เราของลิงค์ไปคำถามที่ 34 หน้าเว็บจะ render หน้าของคำถามที่ 34 ออกมา จะได้คำว่า You're looking at question 34
กลับไปที่ views.py แก้ไขตรง method index ให้เป็นดังภาพ โดยโค้ดข้างต้น จะแสดงคำถามล่าสุด 5 คำถาม เรียงตามวันเวลาที่สร้างคำถาม
เว็บจะบอกให้เราสร้างโฟลเดอร์ templates ในแอพ และในโฟลเดอร์ templates ก็สร้างโฟลเดอร์ที่มีชื่อเดียวกับแอพ คือ polls ขึ้นมาอีกที และในโฟลเดอร์ polls นั้นให้สร้าง index.html ขึ้นมา
เปิดไฟล์ index.html ขึ้นมา และก็อบโค้ดดังภาพใส่ลงไปในไฟล์ของเรา โดยไฟล์นี้ จะเป็นไฟล์ที่เชื่อมกับ method index ใน views.py ซึ่งจะแสดงคำถามล่าสุด 5 คำถาม แต่หากไม่มีคำถามจะขึ้นว่า No polls are available.
กลับไปที่ views.py ก็อบโค้ดดังภาพไปวางในไฟล์ของเราเพื่อเป็นการเชื่อมไปยัง templates ของเรา
จากภาพที่แล้ว เราจะทำการให้โค้ดกระชับและอ่านง่ายขึ้นโดยทำเป็นโค้ดดังภาพข้างต้น
ต่อมาที่ไฟล์เดิม เราจะทำการแก้ไขหน้า Error ให้แสดงข้อความที่เราต้องการ โดยใส่โค้ดไปในไฟล์ของเราที่ method detail ดังภาพข้างต้น
จากนั้นสร้าง detail.html ในที่เดียวกับ index.html และใส่ข้อความไปดังภาพ
เมื่อไปที่หน้าเว็บเพจแล้ว หากเกิดการ Error จะขึ้นข้อความว่า Question does not exist
โดยในเว็บจะบอกให้เราใส่ question id เป็นเลขที่ไม่ตรงกับคำถามใดๆที่เรามี
จากนั้นทำโค้ดให้กระชับ เหมือนกับที่ทำกับ method index
กลับไปที่ detail.html ให้ใส่โค้ดไปในไฟล์ของเราดังภาพ ซึ่งจะเชื่อมกับ method detail ใน views.py เช่นกัน โดยโค้ดจะแสดงคำถามด้วยตัวหนา และแสดงช้อยส์ของคำถามนั้นทั้งหมด
ไปที่ urls.py ให้ใส่ app_name = 'polls' เข้าไปดังภาพ เป็นการกำหนดชื่อแอพของเรา ว่าลิงค์ที่มีอยู่คือของแอพๆไหน
ไปที่ index.html ให้แก้ไขโค้ดจากด้านบนเป็นด้านล่าง หลังจากที่เรากำหนดชื่อแอพของเราใน urls.py แล้ว เป็นการบอกว่า ให้เชื่อมลิงค์ไปที่หน้า detail ของแอพ polls นั่นเอง
ไม่มีความคิดเห็น:
แสดงความคิดเห็น