ส่วนนี้เราจะมาทำส่วนการทำรายการนะครับ
1.สร้างไฟล์ ManMon/templates/ManMon/accountInput.html แล้วใส่โค้ดด้านล่าง ในส่วนนี้จะ
เป็นส่วนที่ใช้เพื่อใส่ข้อมูลลงไป
<html>
<h1 style = "text-align: center;">Manage Your Money</h1>
<form action="{% url 'ManMon:saveAccount' %}" method="post">
{% csrf_token %}
<p>
Note:
<input type="text" name="note"></p>
<p>Money:
<input type="number" name="money" step="any"></p>
<p>Date:
<input type="datetime-local" name="dmy"></p><br>
<input type="radio" name="choice" value="income">
<label style = "color:rgb(110, 101, 252);" >income</label>
<p>Type:
<select name="type">
{% for typeincome in type_in_list %}
<option for="type_income{{ forloop.counter }}">{{ typeincome.type_income }}</option>
{% endfor %}
</select>
</p><br>
<input type="radio" name="choice" value="payment">
<label style = "color:rgb(110, 101, 252);">payment</label>
<p>Type:
<select name="type">
{% for typepayment in type_pay_list %}
<option for="type_payment{{ forloop.counter }}">{{ typepayment.type_payment }}</option>
{% endfor %}
</select>
</p>
<input type="submit" >
</form>
</html>
จากโค้ดด้านบน จะมี input 5 ตัว คือ
note - ใช้กรอกรายละเอียดของรายการ
money - ใช้กรอกจำนวนเงินของรายการ
choice - ใช้เลือกว่าจะเป็น input แบบ income หรือ payment
type - ใช้เลือกประเภทของรายการ
dmy - ใช้เลือกเวลาและวันที่ที่ทำรายการ
2.สร้าง method callAccountInput ซึ่งในส่วนนี้จะเรียก template accountInput มา และส่งค่าที่อยู่
ใน TypeIncome และ TypePayment ออกไป
def callAccountInput(request):
type_in_list = TypeIncome.objects.order_by('-type_income')
type_pay_list = TypePayment.objects.order_by('-type_payment')
return render(request, 'ManMon/accountInput.html', {'type_in_list':type_in_list,'type_pay_list':type_pay_list})
3.ไปที่ไฟล์ ManMon/urls.py แล้วใส่ url ลงไปตามนี้
url(r'^accountInput$', views.callAccountInput, name="callAccountInput")
จากนั้น ให้กลับไปที่ไฟล์ ManMon/templates/ManMon/main.html แล้วเพิ่มโค้ดนี้เข้าไป
<a href="{% url 'ManMon:callAccountInput' %}">{{"Account Input"}}</a>
ผลคือเราจะได้เป็นปุ่มที่เราจะสามารถเข้าไปที่เราจะสามารถกรอกข้อมูลได้
4.เราทำในส่วนกรอกข้อมูลแล้วแต่ ยังไม่ได้ทำได้ทำในส่วนเก็บข้อมูล เพราะฉะนั้น เราจะมา
เก็บข้อมูลกัน โดยเราจะเข้าไปใน view.py แล้วสร้าง method saveAccount
def saveAccount(request):
try:
note = request.POST['note']
money = request.POST['money']
type_note = request.POST['type']
date = request.POST['dmy']
except:
note = ""
money = ""
type_note = ""
date = ""
if(request.POST['choice'] == 'payment'):
money = (-1)*float(money)
ac = Account(note = note, money = money, type_note = type_note, pub_date = date)
ac.save()
return render(request, 'ManMon/saveAccount.html',{'note':note, 'money':money, 'type_note':type_note, 'date':date})
ซึ่งเราจะให้ POST ดึงค่าที่ได้จาก templates ที่ได้จากการ submit มา แล้วนำไปเก็บไว้ใน
Account แล้วส่งค่าที่ได้เก็บไปแล้ว ส่งไปที่หน้า template saveAccount
5.เมื่อเราสร้าง method saveAccount แล้วเราก็จะเพิ่ม url ของ method นี้เพื่อให้เราสามารถใช้
method
url(r'^accountInput$', views.callAccountInput, name="callAccountInput")
6.ในส่วนนี้จะเป็นการบอก ผู้ใช้ว่า ผู้ใช้ได้ทำรายการอะไรไปแล้ว โดยจะได้รับค่าจาก method
saveAccount จะมีโค้ดดังนี้
<html>
<h1 style = "text-align:center; font-size:330%;">Manage Your Money</h1>
<h1>You're already save:</h1>
<p>Note : {{note}}</p>
<p>Type : {{note_type}}</p>
<p>Money : {{money}}</p>
<p>Date : {{date}}</p>
<a href="{% url 'ManMon:mainpage'%}" class="circleBtn">{{"back to main page"}}</a>
</html>
