今日要實作餐廳介紹的子頁面,因此需要新增餐廳ORM的欄位。
首先我們到url.py
裡面新增一個pattern
path('<int:place_id>/', place_introduction, name='food_introduction'),
接著在view.py
的檔案裡面新增子頁面需要的資料。
今天我們會增加電話、官網以及店家介紹三種資料。
新建一個place_introduction
的function,這個名稱要與剛剛的url pattern相同。因為目前只有店家的名字跟地址,因此等等我們在資料庫新增資料後再回來修改。
def place_introduction(request, place_id: int):
place = Place.objects.get(id=place_id)
name = place.name
address = place.address
return render(
request,
'food/place_introduction.html',
{'store': place, 'name': name, 'address': address,},
)
接下來我們進入到template/food
的資料夾底下,建立名為place_introduction.html
的檔案,也就是子頁面的template。
[參考資料](https://www.codeply.com/go/EIOtI7nkP8)
寫完HTML模板之後,我們回到後端編輯資料庫。
進入到model.py
,我們預計在Place
底下增加電話、官網等資料,所以在原有的程式碼底下加上這兩種新的欄位
phone_number = models.CharField(max_length=20, default="No phone number")
web_site = models.CharField(max_length=200, default="No web site")
introduction = models.CharField(max_length=100)
這邊我們用到了default
這項參數,因為並不是每家店都有電話或官網,所以設定一個預設值作為沒有這項資料時的內容。
改好的Model記得到Terminal使用以下兩個指令更新資料庫
python manage.py makemigrations
python manage.py migrate
之後我們就可以執行runserver
,到後台查看剛剛的更新
這邊我們也在資料庫中新增第二筆資料。櫻之庭食堂位於成大醫學院附近的巷弄內,是一間人氣極高的日式定食餐廳,其平易近人的價格與清淡少油卻美味的調味方式,使其成為附近學生與居民的最愛。除了主菜與三份小菜之外,內用還可續白飯或小菜一份,屬於CP值極高的小店,運氣好的話也許你還會遇上可愛的店貓在門口迎接你喔~
最後我們將剛剛新增的資料加入template,預覽今天的成果。
找到我們剛剛預留的電話我們剛剛預留的電話以及網址的位置,填入剛剛兩項資料的名稱
<div><span class="material-icons">
phone
</span><label for="">{{ phone_number }}</label></div>
<div><span class="material-icons">
open_in_new
</span><label for="">{{ web_site }}</label></div>
還有店家介紹的欄位
<div class="col-4">
<label for="">店家簡介</label>
<p>{{ introduction }}</p>
</div>
台南不需要米其林
- 專案程式碼
- 專案文件與鐵人賽文章
- 參賽團隊 台南巷弄美食獵人