之前我們完成了Product的新增功能,今天我們要來完成Product的編輯功能囉。
今日目標:
1. 在Index頁面提供編輯按鈕
2. 完成編輯功能與頁面
3. 若使用者輸入錯誤編輯的Url請求,則導回Index頁面並顯示錯誤訊息
我們下列步驟進行:
1. 在Index頁面中,新增[編輯]與[刪除]的ActionLink,幫助使用者轉導至對應頁面
2. 至Product Controller,新增Edit()方法,輸入為id,此Action是準備接收剛剛步驟1Index頁面新增的[Edit]超連結之請求(Request)。
3. 準備加入Edit頁面,在View()按下滑鼠右鍵,點選[新增檢視]
4. 範本選擇[Edit],模型類別選擇[Product(Carts.Models)]後點選[加入]
5. 此時Visula Studio會幫我們產生好Edit頁面,基本上不需更改
6. 回到ProductController,新增標示為[HttpPost]的Edit()方法,並加上處理程式碼。需注意的為97~103行,是將使用者回傳回來的變更資料儲存起來。
7. 運行專案,瀏覽網址[http://localhost:51352/Product]可以發現我們在步驟1加上的操作按鈕[編輯]與[刪除],在其中一筆資料點選[編輯]
8. 此時會跳轉至Edit頁面,我們可以看到網址有把id(8)帶入。編輯其中一個欄位後點選[Save]按鈕
9. 此時會導回Index頁面,並且發現資料已經被變更囉,也顯示了成功編輯的提示訊息
10. 如果故意在網址列輸入編輯頁面並且為不存在的id,則會自動轉導回Index頁面並提示錯誤訊息
這樣就完成了Product的編輯功能囉,明天我們繼續實現Product的刪除功能。
*今天的原始碼請參考這裡
You downloaded this Project, An error message appears when you run this Project.
solution:
In Models.Carts.edmx
[Product]
[CategoryId] Change to int16
[Quantity] Change to int16