延續【Day 15】完成在網頁上新增紀錄(Record)到資料表的功能，今天我們要來實作在網頁上點擊按鈕後，即時在資料表刪除對應欄位的資料。我們今天總共會需要動到3個檔案，它們分別是 :

• members/templates/index.html
• members/views.py
• members/urls.py

修改 Templates

我們需要在表格的每列資料後方新增1欄，用來放置刪除該列資料的按鈕。
把members/templates/index.html修改成以下這樣 :

<h1>Members</h1>

<table border="1">
{% for x in mymembers %}
  <tr>
  <td>{{ x.id }}</td>
  <td>{{ x.firstname }}</td>
  <td>{{ x.lastname }}</td>
  <td><a href="delete/{{ x.id }}">delete</a></td>
  </tr>
{% endfor %}
</table>

<p>
<a href="add/">Add member</a>
</p>

這邊我們要特別注意，路徑delete/{{ x.id }}帶有原先紀錄(Record)的id值，它是用來在之後刪除對應id值的那筆紀錄(Record)，同時也因為delete/後面的id數值不固定，所以在修改urls.py的urlpatterns的時候，會使用到比較特殊的格式。

修改 URLs

起初可能會認為既然路徑delete/{{ x.id }}的id值不固定，那在urls.py的urlpatterns就需要新增好幾個path吧? 但其實Django的URLs有特殊的格式，它允許path裡面出現變數，所以我們還是只要在urlpatterns加1個path就好囉!

把members/urls.py修改成以下這樣 :

from django.urls import path
from . import views

urlpatterns = [
  path('', views.index, name='index'),
  path('add/', views.add, name='add'),
  path('add/addrecord/', views.addrecord, name='addrecord'),
  path('delete/<int:id>', views.delete, name='delete'), #1
]

1. 這邊出現新格式<int:id>，它是用來讓path可以攜帶參數，前面的int是參數型別，後面的id則是參數名稱。除新格式外，views.py的delete方法在處理請求的時候，也跟前面有稍許不同，這邊的delete方法會以delete(request,id)的形式被呼叫，而最後的路徑別名則是跟之前相同沒有改變功能。

修改完URLs後，我們還缺1個在members/views.py的delete方法。

修改 Views

把members/views.py修改成像下面這樣 :

#上面跟之前都一樣故省略...

def addrecord(request):
  x = request.POST['first']
  y = request.POST['last']
  member = Members(firstname=x, lastname=y)
  member.save()
  return HttpResponseRedirect(reverse('index'))

def delete(request, id): #1
  member = Members.objects.get(id=id) #2
  member.delete() #3
  return HttpResponseRedirect(reverse('index')) #4

1. 在URLs的部分有說過delete會以delete(request,id)的格式被呼叫，所以這邊才會如此定義該方法

2. Members.objects.get(id=id)，它是被定義在QuerySet下的方法，用來在資料表中尋找符合特定欄位值的紀錄(Record)，這邊在資料表上尋找id相同於點擊刪除資料那列id的紀錄

3. 因為Django的資料庫操作採用的是ORM，所以這邊可以直接使用映射物件自帶的delete方法去刪除資料表上的紀錄(Record)

4. 跟先前一樣，在刪除資料後就直接跳轉回原先呈現表格資料的index.html頁面

最後，來檢視今天的成果吧!

啟動 Server 檢視成果

1. 打開CMD並切換到虛擬環境(python venv)的資料夾路徑下

   (實際venv路徑不一定會跟我一樣喔!)

   

2. 輸入以下指令啟動虛擬環境

   Scripts\activate.bat
   

   

   啟動虛擬環境後結果如下:

   

3. 接著切換路徑到Django Project所在的資料夾下

   

4. 接著輸入以下指令Start Server

   py manage.py runserver
   

   

5. 在瀏覽器輸入對應的網址(127.0.0.1:8000/members/)，接著點擊delete那欄就可以看到這次的成果

   
   

到現在我們已經學會在網頁上新增、刪除資料表的資料，接下來要學習的是在網頁更新資料表的資料，因為內容會比較多，所以一樣會拆成上、下兩個部分。

補充資料

URL dispatcher -- Django Documentation
QuerySet API reference -- Django Documentation