昨天完成 Store 的 LIST 和 CREATE，今天把第二個 Model 的 READ 和 UPDATE 做完！

連結

先來整理一下等等會用到的一些頁面:

<!-- 商店列表頁 -->
http://127.0.0.1:8000/online/store/2

<!-- 商店新增頁 -->
http://127.0.0.1:8000/online/store/2/update/

urls.py

url 設定

# online/urls.py

urlpatterns += [
    path("store/<int:pk>", views.StoreDetailView.as_view(), name="store-detail"),
    path("store/<int:pk>/update/", views.StoreUpdate.as_view(), name="store-update"),
]

views.py

路徑設定好了，接下來當然是收發 request/response 的 views.py 檔案：

# online/views.py

# ... 省略
from .models import Employer, Store

class StoreDetailView(generic.DetailView):
    model = Store    

class StoreUpdate(UpdateView):
    model = Store
    fields = "__all__"

這邊則是設定好剛剛路徑指定的 views.py，這邊跟之前差不多，所以就不再多說

templates - Store READ

1. 在新增 READ 頁面前，我們先把在 store_list 頁面的資訊先更新一下，這樣我們就可以直接點擊物件的ID進到物件資訊頁裡面

<!-- store/online/templates/online/store_list.html -->

{% extends 'sidebar.html' %}

{% block content %}
  <h1>商店列表</h1>
  {% for store in store_list %}
    <ul>
      <!-- 修改這一行 -->
      <li>
        <a href="{{ store.get_absolute_url }}">商店ID</a>: {{ store.id }}        
      </li>      
      <!-- 修改這一行 -->
      <li>店名: {{ store.title }}</li>            
      <li>介紹: {{ store.description }}</li>            
      <li><a href="">刪除商店</a></li>
    </ul>
  {% endfor %}
  
  <br>
  <a href="{% url 'store-create' %}">新增商店</a>
{% endblock %}

2. 新增 http://127.0.0.1:8000/online/store/1 頁面資料

還記得 READ 對應的 templates 是哪一個嗎？沒錯，就是這個 online/templates/online/store_detail.html

<!-- online/templates/online/store_detail.html -->

{% extends 'sidebar.html' %}

{% block content %}
  <h1>商店資訊頁</h1>
  <hr>
  <p>店名: {{ store.title }} </p>
  <p>介紹: {{ store.description }} </p>
  <p>老闆: {{ store.employer }} </p>
  
  <a href="{% url 'store-update' store.id %}">編輯商店資料</a>
{% endblock %}

這樣設定好後，我們點擊剛剛在 store_list 頁面上新增的 商店ID 按鈕，點下去會進到該 商品 detail 頁 我們先來看下圖：

這邊有一點要特別提醒的，就是這一句 <p>老闆: {{ store.employer }} </p>，還記得我們 Store 有一個欄位是 Employer 嗎？我們只要用 .點 的方式，就可以得到 這間商店的老闆 的資料，如果你今天想要在這個頁面顯示老闆的年紀，你可以這樣增加：

<!-- online/templates/online/store_detail.html -->

{% extends 'sidebar.html' %}

{% block content %}
  <h1>商店資訊頁</h1>
  <hr>
  <p>店名: {{ store.title }} </p>
  <p>介紹: {{ store.description }} </p>
  <p>老闆: {{ store.employer }} </p>
  <!-- 這一段 -->
  <p>老闆的年紀: {{ store.employer.age }} </p>
  <!-- 這一段 -->
  <a href="{% url 'store-list' %}">返回商店列表頁</a>
{% endblock %}

然後再看一下圖：

我們這樣使用 <p>老闆的年紀: {{ store.employer.age }} </p>，先用 Store 取得該店老闆，之後再取得老闆的年紀，一層一層的 .點 下去

Ps. 還記得為什麼 <p>老闆: {{ store.employer }} </p> 這樣寫就可以顯示老闆的 first_name-last_name 嗎？忘記的記得回去看 __str__ 代表的意義喔！

templates - Store UPDATE

1. 再來是更新的部分，我們先在 store-detail 頁面新增 update 連結，這樣就可以直接點過去：

<!-- online/templates/online/store_detail.html -->
{% extends 'sidebar.html' %}

{% block content %}
  <h1>商店資訊頁</h1>
  <hr>
  <!-- 這一段 -->
  <p><a href="{% url 'store-update' store.id %}">商店ID</a> : {{ store.id }} </p>
  <!-- 這一段 -->
  <p>店名: {{ store.title }} </p>
  <p>介紹: {{ store.description }} </p>
  <p>老闆: {{ store.employer }} </p>
  <p>老闆的年紀: {{ store.employer.age }} </p>
  
  <a href="{% url 'store-list' %}">返回商店列表頁</a>
{% endblock %}

2. 新增 http://127.0.0.1:8000/online/store/1/update 頁面資料

不過大家應該還記得，因為 Create 和 Update 共用 online/templates/online/store_form.html 頁面的關係，所以不用再新增：

Ps. 這邊只是再寫一次，正常來說昨天已經新增好了

<!-- store/online/templates/online/store_form.html -->

{% extends 'sidebar.html' %}

{% block content %}
  <h2>{% if request.resolver_match.url_name == 'store-create' %}新增{% else %}編輯{% endif %} 商店</h2>
  <form method="post">
    {% csrf_token %}
    {{ form.as_p }}
    <button type="submit">儲存</button>
  </form>
  <a href="{% url 'store-list' %}">返回列表</a>
{% endblock %}

我們直接來看畫面，點擊剛剛在 store-detail 新增好的 store-update 按鈕後，直接點進去，會看到這樣的畫面：

可以隨意修改後，按下儲存，會直接導回 store-detail 頁面，還記得為什麼會直接導回這個頁面嗎？原因是他預設的關係，如果你不想要導回 detail 頁面，可以使用 success_url 來指定返回頁面。

這樣我們就完成了的二個 Model 的 Store READ 和 UPDATE～

總結

今天學到哪些東西呢？

1. 第二個 Model 的 READ 和 UPDATE
2. 用 Store 變數如何取得 Employer 的資料

最後附上 Github: https://github.com/eagle0526/Django-store