Ledger (Export csv)

    ข้ามจากการตกแต่งด้วย css เป็นเรื่อง csv ก่อนละกันนะครับ เนื่องจากว่า SPN ได้ให้ลองสามารถ export ข้อมูลออกเป็นไฟล์ csv ได้ ผมเลยไปทำการค้นคว้าข้อมูล โดยได้เว็บของ
django เว็บนี้มาช่วยในการทำงานเกี่ยวกับ csv output Click โดยจะเป็นการใช้ api ของ python ในการ generate csv file หรือ ก็คือสร้าง csv ไฟล์ขึ้นมาได้เองเลย โดยโค้ดเป็นดังนี้

โดยเขาบอกว่า วิธีการ generate นี้ง่ายมากกก ก็แค่ส่งผ่าน response ให้กับ csv.writer() 

ส่วน response['Content-Disposition'] = 'attachment; filename="history.csv"' 

จะเป็นการตั้งชื่อไฟล์ที่จะดาวน์โหลด โดยผมตั้งว่า history.csv 

หลังจากนั้นก็จะ wrtiterow(.....) โดยตัวแรกผมเอาไว้เขียนหัวไฟล์ ส่วนที่เหลือก็ใช้การวน for loop ในการใส่ลงไปในไฟล์ csv โดยจะเรียงเป็น pubdate note income expenese  

นี้ก็เป็นหน้าตาของไฟล์ csv ที่ได้ดาวน์โหลดมาก็ตรงตาม 

ตารางบันทึกรายรับ รายจ่ายอย่างถูกต้อง โดยผมจะทำปุ่มไว้ให้ user กด 

ส่วนวิธีเชื่อม link ต่างๆ ผมขอข้ามไปเพราะว่าถ้าติดตามบล็อกผมมาตลอดก็จะรู้วิธีทำแล้วละครับวันนี้ก็ขอจบเพียงเท่านี้ ขอตัวไป ตกแต่งต่อเลยนะครับ

Ledger (Theme)

    SPN ได้กล่าวเปรยๆเอาไว้ประมาณว่า ถ้าว่างก็ลองทำ Theme ดู ตอนนี้ก็สามารถทำได้แล้ว แต่ด้วยความรู้ที่มีน้อยนิด วิธีการอาจจะดู Hardcore มากเกินไปสักหน่อย

commit ที่มีแค่ 2 commits เกิดจาก ปัญหามันมีไม่เยอะ แต่แก้ลำบากครับ (55+)

    ใน commit แรกสิ่งที่ได้ทำก็จะประมาณว่า ผมสร้างไฟล์ css สำหรับไว้ใช้สำหรับ template แล้วผมก็สร้างไว้ 2 ชุด เพื่อนำไปทำ ธีม แต่ปัญหาก็จะเกิดก็ตอนที่ว่าเปิดไป แล้วเปิดกลับ สิ่งที่เกิดขึึ้นคือ รูปภาพกลับไปยังที่เดิม วิธีแก้ของผมก็คือใส่ ค่า theme ซึ่งเป็นค่าตัวแปรที่รับค่ามาจาก selected_theme เป็นค่าที่รับมาจากปุ่มกด แบบ radio

โดยค่า selected_theme จะถูก request และเก็บในตัวแปร theme

จากฟังก์ชั่น theme_select() ใน views.py

แล้วก็จะใช้ HttpResponseRedirect และ reverse ไปที่ หน้า index และ 

ส่ง argument theme ไปให้เพื่อให้รู้ว่า theme นั้นถูกเลือก

หลังจากนั้นก็จะเปลี่ยนแปลงการเรียกไฟล์ css โดยจะใช้เป็น

/ledger/{{theme}}.css ถ้าหากค่าของ theme = style1 

url ที่ได้ก็จะเป็น /ledger/style1.css

โดยทั้งนี้จะต้องมีการแก้ไข urls.py ด้วยเช่นกัน โดยแก้ไข reg ex เสียใหม่

?P<theme>[a-zA-Z0-9] จะเป็นการรับค่าพวก a-z ได้ และ 

A-Z ได้ และก็สามารถรับ ตัวเลขได้ 0-9 ได้

    แต่ทว่า ผมไม่ค่อยชอบการตกแต่ง templates สักเท่าไรเลยยังไม่ได้ตกแต่งไฟล์ templates ด้วย css เลย 

Update Github's status

    ในการทดลองแยก repository ตาม app แต่ละ app นั้น ส่วนตัวผมนั้นรู้สึกชอบมาก เพราะว่ามันเป็นระบบดีในการทำงาน นี้ก็เป็นการ commit ทั้งหมด หลังจากที่ได้ สร้าง repository ใหม่

repository => homepage มีการทำงานนิดหน่อย

repository => polls หลังจากแอดไว้ ก็ไม่ได้แตะเลย 55

repository => ledger อันนี้เด็ดเลยครับ เนื่องจากเป็นงานที่ทำอยู่ปัจจุบัน ก็มีการ commit เรื่อยๆทำไปเจอบัคไปแก้บัคไป สนุกสนาน : )

New Repository

    ในตอนนี้ได้ทำการแยกไฟล์ แต่ละ App ให้มี repository เป็นของตัวเอง เพื่อเป็นการทดลองว่าจะสะดวกต่อการแก้ไข และ push กับ pull ระหว่างในเครื่องและบน pythonanywhere มากกว่าที่จะเก็บเป็น project หรือ เปล่า โดยตอนนี้จะมีทั้งหมด 3 repository (commit อันเก่าหายไปหมดเลย) ซึ่งถ้าหากว่าไม่ได้มีผลดีขึ้น งานหน้าก็จะกลับไปใช้เก็บทั้งโปรเจคท์ดังเดิม

Ledger Final Chapter

    ในบทความนี้จะเป็นการเล่าถึง web app Ledger หรือ บันทึกรายรับรายจ่ายครั้งสุดท้าย เพราะคิดว่าคงไม่มีปัญหาอะไรแล้วครับ แต่ถ้าหากมีเพิ่มเติม ก็อาจจะว่ากันต่อภายในบทความครั้งหน้าครับ

    นี้คือหน้าตาตอนหลังจากตกแต่งเสร็จ(ไม่ค่อยสวยเท่าไร 55)

    โดยจะขออธิบายตาม commit (จากล่างขึ้นบน)

delete use timezone(not necessary)

    ลบวิธีการใส่เวลาแบบ use timezone ออกไปเนื่องจากไม่จำเป็น

delete total_income and total_expense to 1 funtion

    จากครั้งที่แล้วที่นำเสนอไป ฟังก์ชั่นคำนวณค่ารวมของรายรับ กับ ร่ายจ่าย ใช้ฟังก์ชั่นเป็นของตัวเองในการคำนวณ ได้ยุบเหลือเพียงฟังก์ชั่นเดียวโดยดังนี้

    ในการวนลูป 1 ครั้งจะเช็คเลยว่าเป็นรายรับ หรือ รายจ่าย แล้วก็แยกบวกตามประเภทนั้นๆ หลังจากนั้น ก็เก็บค่าไว้ใน list ชื่อ total แล้ว return กลับไป

    โดย total[0] = total_income และ total[1] = total_expense

finally fix that input date problem

    เนื่องจาก Firefox ไม่รองรับการใช้ input date เลยได้ไปหาวิธีการใช้ datepicker วิธีอื่นๆ สิ่งที่ได้คือการใช้ jQuery https://jqueryui.com/datepicker/#default  

    

    ซึ่งช่วยแก้ปัญหาได้มากเลยที่เดียว แต่ว่าจะต้องมีการตั้งค่า format ให้มันก่อน เพราะว่า Model เราใช้เป็น DateField() โดยมันจะรับค่าเป็น yy-mm-dd เท่าน้้น โดยวิธีการตั้งค่า format ก็ได้มาจากการเปิด youtube หาวิธี https://www.youtube.com/watch?v=9U_5Z4WqswI ( ต้องขอบคุณจริงๆที่สมัยนี้การค้นคว้าหาข้อมูลทำได้ง่ายๆ)

delete total column

    ได้ลบตัวค่ายอดคงเหลือ ของแต่ละแถวออกไปเพราะมันไม่จำเป็นอีกต่อไปแล้ว

create verify page

    ครั้งที่แล้วการลบนั้นก่อให้เกิดปัญหาเรื่องยอดคงเหลือของแต่ละแถว แต่ตอนนี้ได้ลบยอดคงเหลือดังกล่าวไปแล้ว ทำให้สามารถสานต่อการลบได้ โดยจะเปลี่ยนจากการลบได้หลายๆตัว ให้เป็นลบได้เพียงตัวเดียว ก็เพราะว่า ต้องการจะให้มีหน้าแสดงเตือน ด้วยว่าจะต้องการลบจริงๆ แล้วอีกอย่างคือ บันทึกรายรับ รายจ่ายเป็นสิ่งที่ต้องคิดก่อนที่จะบันทึก เลยไม่น่าจะมีความผิดพลาดมากมายให้ขนาดว่า ต้องลบทีละหลายๆรายการ

เมื่อเลือกรายการแล้วกด Submit

จะมีปุ่ม Yes กับ No ให้เลือก

    เมื่อเลือก Yes ก็จะลบรายการนั้นทิ้งไป แต่ถ้าหากว่าเลือก No ก็จะกลับไปหน้าเลือกลบรายการใหม่

fill color

    ตกแต่งสีสันให้สวยงาม(แต่ดันไม่สวยไม่งาม)

    

    

Ledger pt.7

    ในที่สุดก็ใส่ comma ผ่านได้แล้ว ต้องขอขอบคุณ Thakdanai Kunsaen ที่แนะนำมาเว็บนี้เลย

https://docs.djangoproject.com/en/1.10/ref/contrib/humanize/

    โดยเริ่มจาก

    ไปเพิ่ม 'django.contrib.humanize' ใน INSTALLED_APPS ในไฟล์ setting ก่อนแล้วก็ใส่

{% load humaninze %} ไว้ใน template ที่ต้องการใช้ filter นี้ วิธีใช้ก็ตามภาพด้านล่างเลยครับผม

Ledger pt.6

    ในตอนนี้ web app ledger สามารถที่จะลบรายการบันทึกได้แล้ว

    Use case การลบรายการ

- คลิกที่คำว่า 'Click' ด้านล่างของข้อความ 'Edit'

- เมื่อเข้ามาหน้าต่างนี้ เลือกรายการที่จะลบ โดยติ๊กเลือกที่คอลัมน์แรก สามารถเลือกได้หลายรายการ

- กด Submit

โค้ดที่เพิ่มมาจากครั้งที่แล้วมีดังนี้

- template => edit_page.html

- url => edit_list, del_list

- funtion => edit_list, del_list

โดยจะให้ดูที่ส่วนของ template ก่อน

ใช้ form โดยเมื่อกด submit จะ link ไปที่ url ชื่อ del_list ค่าที่ส่งไปจะเป็นค่า id ของรายการนั้นๆ

Function del_list

    ในฟังก์ชั่น del_list มีการรับค่าแบบเป็น list เผื่อว่ามีการลบรายการ โดยค่าที่รับจะเป็น id ของรายการที่ต้องการจะลบ โดยนำไปใส่ไว้ในตัวแปร g(ไม่สื่อความหมายนะเนี่ย) หลังจากนั้นก็วนลูปลบ object ของ Model Note หรือ ก็คือลบรายการบันทึก โดยใส่ค่า pk = g[n]  หลังจากนั้นก็ redirect ไปที่หน้า edit_list เช่นดังเดิม

    ในส่วนของ edit_list นั้นผมก็ไม่อธิบาย เพราะว่ามันก็คือการนำ template index.html มาแก้ไขให้เป็นลักษณะของหน้าแก้ไขเท่านั้นเองครับผม

สิ่งที่ต้องทำต่อ
- แก้ไขเรื่องบัคของเวลา
- การใส่ comma
- ใส่ comment
- pep8

Ledger pt.5

     ในขณะที่ทำงานอยู่นั้น เพื่อนได้มาหอแล้วได้บอกว่าที่ผมทำไปเกี่ยวกับเรื่อง Total นั้นมันยังไม่ถูกนะ บอกว่าผมเข้าใจผิด เพื่อนบอกให้ลองหารูปใน google ดู ผลก็คือ......

Cr.: https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMVCA6_v39n7qwHS47Xp6FB2xfMZZaLXY7TGp9jsSbfR90TfyqV2JT23YFxhwCe9KBsaDBEph8wk4U7Gb1MR1uXgY6jBdM_TJ6kbxnsHHw6elNQdOzLbDS1O7FNLJgjkI0uO9LRVwT7XuB/s1600/IS18.jpg

    ผิดเต็มๆ ใช่แล้วครับบรรทัดแรกของการบันทึก เงินคงเหลือก็ขึ้นตามนั้นเลยครับไม่ได้เป็น 0 ผมเลยนั่งแก้ ผลที่ได้ก็เป็นดังนี้

    เย้ !! ดูมีมาตรฐานขึ้นมาเยอะเลย โดยวิธีที่ใช้ในการแก้ปัญหาก็คือ

    บรรทัด ที่สามแค่บรรทัดเดียวเลย โดยโค้ดส่วนนี้จะอยู่ใน function add_list วิธีก็คือเวลาเราจะใส่ค่า cost_total เราจะเอาค่าที่ได้จากการคำนวณค่ายอดคงเหลือ ที่ได้มาจาก function total_money() มาเลยไม่ได้เพราะว่าตอนแรกมัน มันยังไม่มี object ไปคำนวณเงินค่ามันเลยออกมาเป็น 0 ผมก็เลยให้มันบวกกับค่า new_money ที่ถูกกลับเครื่องหมาย แล้วไปบวกเพิ่มกับ ค่าที่ได้จาก total_money() ก่อน แล้วค่อยใส่ลงไปในค่า cost_total นั้นเอง ง่ายใช่ไหมละ ทำไมคิดไม่ได้ตั้งแต่แรก ส่วน สองบรรทัดแรกนั้นผมไม่ได้อธิบายไว้ก่อนหน้านี้ ซึ่งมันก็คือ 

    money_type จะเป็นค่าที่ได้จากการ request.POST หรือ ค่าที่รับมาจากการ submit form นั้นเองโดยตัวนี้จะรับค่ามาจากเจ้านี้..!

    โดย value ก็จะเป็น in , ex ก็ถ้า money_type = ex หรือ ติ๊กว่าเป็นรายจ่าย ก็จะนำค่า new_money มาใส่เครื่องหมาย - ด้านหน้า ทำให้เป็นค่าติดลบนั้นเองงง !!

    ส่วนที่ทำเพิ่มมาอีกนิดนึง ก็จากตัวอย่างเลยครับ คือ บรรทัดสุดท้ายเขาจะใส่เป็น รวมของแต่ละหลักไว้ๆ ซึ่งผมก็ต้องขอขอบคุณตัวอย่างมาก เพราะผมก็ลืมเรื่องนี้ไปสนิทเลยเหมือนกัน ว่ามันควรจะเป็นแบบนั้น ก็เลยไปจัดเพิ่มมาอีก 2 function ก็คือ total_income() กับ total_expense() 

    ก็จะเหมือนกับ total_money() function ที่ไว้คำนวณยอดคงเหลือทั้งหมด เกือบทุกประการเพียงแต่เพิ่มเจ้าเงื่อนไข if ไว้เช็คว่าค่า cost_value นั้นติดลบหรือไม่ ถ้าหากติดลบ ซึ่งก็คือรายจ่าย ก็จะให้บวกเฉพาะค่าติดลบไปเรื่อยๆ ถ้าหากไม่ติดลบหรือเป็นบวก ก็จะให้บวกเฉพาะค่าบวกไปเรื่อยๆ แค่นี้ก็เรียบร้อย

    การเรียกใช้ function ก็จะไปเรียกใช้ใน function index เพื่อที่จะให้ส่งค่า ไปแสดงโดย มีตัวแปร income_index, expense_index ไว้เก็บค่ารวมของรายรับรายจ่าย แล้วก็ที่ใส่ - ให้กับ total_expense() เพราะว่าตัวนี้จะ return ค่าที่เป็นลบ แต่อยากให้แสดงผลเป็น + ก็เลยให้กลับเครื่องหมายอีกครั้งหนึ่ง แล้วก็ใส่ค่าใน context ไปแสดงผลต่อ

Ledger pt.4

    ในตอนนี้ได้แก้ปัญหาเกี่ยวกับ total ได้แล้ว !!

     ซึ่งวิธีการแก้ปัญหาของผมนั้นก็คือ ....

    ตอนแรกตารางแสดงผลจะแสดงผลจากล่าสุดมาก่อน แต่ตอนนี้ผมได้เปลี่ยนให้แสดงเป็นล่าสุดไปต่อด้านล่าง แล้วก็สร้างตัวแปรอีกตัวมานั้นก็คือ total_index หรือ ก็คือส่วนบรรทัดสุดท้ายนั้นแหละ มาให้แสดงล้นตรงบรรทัดสุดท้ายของรายการ 

    โค้ดของมันก็จะมีหน้าตาดังนี้ ในส่วนของ function index ผมได้ใส่ context เพิ่มเข้าไปอีกตัว เอาไว้เรียกใช้งาน ซึ่งก็คือ total_index ซึ่งจะรับค่ายอดคงเหลือในปัจจุบัน 

    จากครั้งที่แล้วที่ได้อธิบายปัญหาใน Part3 จริงๆแล้วมันก็ไม่ใช่ปัญหาซะทีเดียว เพราะผมมานั่งคิดแล้วว่าจริงๆแล้วมันก็ควรจะเป็นแบบนั้นและ ถูกแล้ว อย่างบรรทัดแรก พ่อให้เงิน 5000 บาท ในตอนนั้นยอดคงเหลือที่เป็นของบรรทัดเดียวกันก็ควรจะเป็น 0 ก่อน เพราะว่าในตอนแรกนั้นยังไม่มีเงินจริงไหมครับ ก็เลยกลายเป็นว่าปัญหาก็คือเราไม่ได้เห็นจำนวนเงินคงเหลือในปัจจุบันเท่านั้นเอง

    เพราะฉะนั้นผมจึงหาวิธีที่จะแสดงจำนวนเงินในปัจจุบันมาให้ได้ก็พอแล้ว โดยที่ผมต้องใส่เข้าไปใน function index ก็เพราะว่า ถ้าคิดจาก flow chart การทำงานของการเพิ่มรายการแล้ว เมื่อ add note เสร็จมันก็จะ redirect หน้าของ index มา เราก็ควรจะให้มีการรับค่ายอดคงเหลือปัจจุบันให้อยู่ใน function index ครับผม

    ส่วนนี้ผ่านไป ต่อไปเป็นเวลาของการใส่เวลาในบันทึกโดยไม่อิงจากเวลาเครื่อง หรือ ใช้ timezone

Ledger pt.3

    เกิดปัญหาซะแล้ว เกี่ยวกับการสร้างยอดเงินคงเหลือสุทธิของแต่ละรายการ

ในตอนแรกก็ได้ไปเพิ่ม ในส่วนของ Model

    เพิ่มเสร็จก็ makemigrations , migrate เรียบร้อยตอนแสดงผลก็ใส่เพิ่มเข้าไปในตาราง

   
    ปัญหาก็ตรงเนี่ยแหละ

    OMG !(Oh my god!) ปัญหามันเกิดจากที่ว่าในตอนแรกการ add_list หรือ function การเพิ่มรายการของผมนั้น มันก็เพิ่มของมันไปปกตินะแหละ แต่ที่เป็นปัญหาคือตัวแปร cost_total ที่เอาไว้สำหรับค่า total ของแต่ละตัวนั้นรับค่ามาจาก function total_money() ซึ่งเจ้า function ตัวนี้มันก็จะคำนวณ ยอดคงเหลือของมันตามปกติ แต่ !! ในการเพิ่มรายการบันทึกอันแรกนะ มันจะคำนวณไม่ได้ ไม่สิ พูดให้ถูกคือมันคำนวณได้ แต่ในการแสดงผลนะ มันจะเป็น 0 ก่อนเพราะว่ายังไม่มีอะไรให้มันไปคำนวณ เอาล่ะปัญหาเกิด

    นี้ก็เป็นเวลา 18.36 น. รู้สึกหิวข้าวเดียวมาต่อละกัน

Ledger pt.2

   

    ได้จัดการแสดงผลของตารางใหม่ ให้มีทั้งตาราง income และ expense แล้วก็คำนวณเงินสุทธิได้แล้ว

    

    ต่อจากตะกี้ ได้แก้ไขส่วนของตารางให้แสดงผลให้ถูกอย่างที่ควรจะเป็น

     ต่อไปก็ได้มีความคิดว่าส่วนของ total เนี่ยจริงๆแล้วมันควรจะแสดงทุกครั้งที่มีการเพิ่มโน๊ตใหม่ หรือ ก็คือแสดงอยู่ในตารางด้วยนั้นแหละ ทีนี้ปัญหาคือ ทำไงอะ ส่วนเรื่องเวลา เนื่องจากวันพฤหัสบดีที่ผ่านมานั้น Thakdani เพื่อนซี้สุดฮาได้ออกไปนำเสนอ แล้วพูดเรื่องที่เกี่ยวกับว่า Mozilla Firefox นั้นไม่ support input type date !!!! อ่าว กรรม browser ระดับนั้นดันไม่ support ซะได้ Thakdani ได้บอกว่าตนนั้น ต้องใช้ javascript หรือ ไม่ css สักตัวนี้แหละในการใช้ date เพราะงั้นผมขอ ข้าม !! ไว้หลังสุดเลยละกันเรื่องนั้น

Ledger use case

    Use case ผมต้องยอมรับเลยว่า เมื่อตอนวันพฤหัสบดีที่ผ่านมา ที่ Sarik Kampan ได้ออกไปนำเสนอ Use case ของ app บัญชีรายรับ รายจ่ายของเขานั้น ผมลืมเรื่องนี้ไปสนิทเลย เพราะฉะนั้น ผมจึงมาทำ Use case ของ app Ledger ของผมเองมั่ง

Ledger : Use Case

1. ผู้ใช้ใส่ url เข้าหน้า app

2. ผู้ใช้ใส่รายการบันทึกในช่องที่เขียนว่า Note

3. ใส่จำนวนเงินในช่องที่เขียนว่า Money

4. เลือกว่าเป็นรายรับหรือรายจ่าย โดยการติ๊กที่ตัวเลือก

5. กด Submit

6. ผลจะปรากฏที่หน้าต่าง browser เป็นแบบตาราง

Ledger pt.1

    ต่อไปนี้การลงบล็อกผมจะไม่อธิบายโค้ดทุกส่วน แต่จะอธิบายแนวคิดและหลักการเอาแทนนะครับ เพราะคิดว่าการอธิบายบางส่วนก็ไม่จำเป็น แนวคิด และ หลักการแก้ปัญหา สำคัญกว่า

    นี้ก็เป็นหน้าตาของ web app ledger ในตอนแรก 

สิ่งที่มันสามารถทำได้ในตอนนี้ก็ได้แก่

- สามารถเพิ่มบันทึกได้ 

- สามารถปริมาณเงินได้

ก็ยังทำได้แค่นี้ สิ่งต่อไปที่จะทำก็คือ

- แยกส่วนของรายรับรายจ่าย ทั้งนี้หมายถึงจะต้องทำตารางเพิ่มให้เห็นชัด ว่าอันไหนรายรับ อันไหนรายจ่าย และ ก็ต้องคิดวิธีคำนวณเงินสุทธิ

- แก้ไขการใส่เวลา เพราะว่าตอนนี้ใส่บันทึกตอนไหนเวลาจะฟิคเป็นของตอนที่บันทึกพอดี ซึ่งตอนเด็กๆจำได้ว่าตอนคุณครูสั่งให้ทำบันทึกรายรับ รายจ่าย ผมก็จะเขียนเวลาขึ้นมาเองไม่ได้ทำตามเวลานั้นจริงๆ เพราะงั้นผมก็จะทำให้มันสามารถตั้ง ว/ด/ป เวลาเองได้ 

- ใส่ลูกน้ำตามหลัก(ซึ่งวุ่นวายมาก(สำหรับผม))

ในตอนนี้ก็มีแค่นี้ก่อนนะครับ

pythonanywhere

    ห่างหายจากการอัพบล็อคไปนาน ครั้งนี้กลับมาพร้อมกับการนำ web app ที่สร้างมาไปไว้บน cloud ของ pythonanywhere.com ทำให้สามารถ เข้า web app ได้แบบออนไลน์แล้ว โดยที่ได้ใส่ไปตอนนี้มีทั้งหมด 2 ตัว คือ polls และ ledger

polls =====>  http://beardjango.pythonanywhere.com/polls/

ledger ====> http://beardjango.pythonanywhere.com/ledger/

    ซึ่ง app polls ก็จะเป็นของ tutorial ที่ได้ลองทำ แต่ ledger จะเป็นบัญชีรายรับ รายจ่ายซึ่งเป็น assignment ที่ได้รับคะแนนโหวตจากทางห้องมา

    แต่ผมไม่ได้กลับมาแค่นี้ ตอนนี้ได้ลองใช้ git เป็นที่เรียบร้อยแล้ว ซึ่งก็เกือบจะงงๆ แต่ตอนนี้ก็ใช้งานได้แล้ว

link =====> https://bitbucket.org/thanut_suwannawong/ledger

App polls modify

     จาก week 4-2 SPN ได้บอกว่าให้ลองไปพัฒนา app polls ต่อ ให้มันสร้างคำถามได้ สร้างตัวเลือกได้ผลที่ออกมาคือ ...

สามารถเพิ่มคำถามเพิ่มได้แล้ว !!!

ในส่วนนี้ก็ใช้เรื่องของ form มาช่วย โค้ดจะมีหน้าตาดังนี้

 
    โค้ดส่วนนี้จะอยู่ข้างล่างของโค้ด index.html โดยจะมี input แบบ text โดยเมื่อใส่คำถาม แล้วกด add ก็จะไปดึง function add_question มาทำงานต่อไป ปล.ในรูุป _ มันหายไปยังไงก็ไม่ทราบ

    ใน add_question ก็มีการรับค่าของ new_question หรือก็คือค่า text ที่ผู้ใช้ใส่มา เก็บไว้ในตัวแปร text_value หลักจากนั้นก็เอาไปใส่ใน model Question โดยอิงจาก tutorial ในส่วนของการเพิ่มคำถาม แล้วก็ redirect ไปยังหน้า index อีกครั้งเหมือนเป็นการ refresh หน้าให้ update คำถาม

ต่อไปแค่เพิ่มคำถามยังไม่พอ ต้องให้มันเพิ่มตัวเลือกได้ด้วย !! หน้าตาก็ออกมาประมาณนี้

    หลักการก็คล้ายๆกับการ add คำถามเลย เพียงแต่รอบนี้จะมีเรื่องของ id คำถามมาเกี่ยวด้วยเนื่องจากคำถามแต่ละคำถามต่างก็มี choice ของตัวเอง และ แต่ละคำถามก็มี id ของตัวเองเช่นเดียวกัน

    เริ่มต้นก็จะเหมือนกับส่วนตะกี้ ก็คือใน templates ของ detail.html เราก็เพิ่ม form อีกตัว แต่อันนี้ action หลังจากกดปุ่ม submit จะเป็นการดึง function add_choice และ ใส่ question.id ต่อท้ายไปด้วย

    ใน urls.py ก็จะใส่ regex เป็นดังรูป ใส่ค่าให้กับตัวแปรชื่อ question_id เพื่อไปให้กับ function add_choice 

    มีการรับค่า new_choice ซึ่งเป็นค่า text มาจากใส่ข้อมูลลงในหน้า detail มาเก็บไว้ในตัวแปรชื่อ text_value(อีกแล้ว) หลังจากนั้นก็ เอาค่า question_id ไปใช้ในการเรียก object คำถามที่มี ID นั้นๆ แล้วก็ create choice_text ใส่ไป และ default ค่า votes = 0 แล้วก็ redirect ไปหาหน้า detail เช่นเดิม พร้อมกับส่ง args เป็น question_id ไปด้วยจะได้แสดงถูกคำถาม

    ต่อมาก็จะทำให้หน้าแสดงผลลัพธ์ หรือ result แสดงผลออกมาเป็นแบบตารางเพื่อความเป็นระเบียบเรียบร้อย ผลที่ได้คือ .....!!

    ก็จะเป็นการแสดงผลแบบ ตารางอย่างง่ายๆ

    ก็จะกำหนด style ให้กับพวก table th td ให้เป็นแบบมีเส้นสีดำทั้งหมด แล้วก็จะปรับความกว้างไปสัก 50% จะได้ไม่ขยายไปเยอะเกินไป แล้ว ก็ใช้ ลูป for วนปริ้นท์ แยกระหว่างตัวเลือก และ ผลโหวต แค่นี้ก็เสร็จแล้ว !!