如何在MVC的單個視圖中添加編輯，刪除和搜索功能？

Question

我是MVC的新用戶。

在MSDN上我研究過，應該有文件夾view與controller同名。對於controller中的每個Action Method，我們必須在同一個文件夾中創建一個View。

我創建其中一個測試應用程序：

我有一個homeController與Index ActionMethod。相應的，我有一個ViewView/home/Index，它只顯示僱員的名單。

我知道我可以在homeController中添加[HTTP POST] Index ActionMethod。

但我想在視圖上添加Delete和Search功能。因此，用戶可以搜索那裏有姓名的員工，並可以刪除同一頁面上的員工。

我不知道如何才能繼續使用此功能。

我仍然使用這段代碼。

homeController

public ActionResult Index() 
    { 
     ViewBag.text = "Records Listing"; 
     var q = from p in objEmp.tbemployees select p; 
     return View(q); 
    } 

Index.cshtml

 @model IEnumerable<MvcApplication6.Models.tbemployee> 
@{ 
    ViewBag.Title = "Index"; 
    Layout = "~/Views/Shared/_Layout.cshtml"; 
} 
<h1>@ViewBag.text</h1> 
<table style="font-size:15px;"> 
    <tr> 
     <th> 
      Name 
     </th> 
     <th> 
      Address 
     </th> 
     <th> 
      Sallary 
     </th> 
    </tr> 
    @foreach (var item in Model) 
    { 
     <tr > 
      <td style="padding:7px;"> 
       @Html.DisplayFor(mm => item.ename) 
      </td> 
      <td style="padding:7px;"> 
       @Html.DisplayFor(mm => item.eadd) 
      </td> 
      <td style="padding:7px;"> 
       @Html.DisplayFor(mm => item.esal) 
      </td> 
       <td style="padding:7px; color:Blue; text-decoration:underline;"> 
      @Html.ActionLink("Edit", "Edit", new { id = item.empno }) 
      </td> 

     </tr> 
    } 
</table> 

感謝。

Answer 1

您可以在控制器中添加並實施Delete操作方法。然後在你看來，請致電@Html.ActionLink("Delete", "Delete", new { id = item.empno })。這將返回一個鏈接到控制器中的Delete方法的超鏈接。

Answer 2

對於刪除您可以添加在表中的列將調用控制器動作，並把它傳遞當前記錄ID：

<tr> 
    <td style="padding:7px;"> 
     @Html.DisplayFor(mm => item.ename) 
    </td> 
    <td style="padding:7px;"> 
     @Html.DisplayFor(mm => item.eadd) 
    </td> 
    <td style="padding:7px;"> 
     @Html.DisplayFor(mm => item.esal) 
    </td> 
    <td style="padding:7px; color:Blue; text-decoration:underline;"> 
     @Html.ActionLink("Delete", "Delete", new { id = item.empno }) 
     @Html.ActionLink("Edit", "Edit", new { id = item.empno }) 
    </td> 
</tr> 

和您的刪除操作：

public ActionResult Delete(int id) 
{ 
    ... use the passed id to delete the record from the database 
    return RedirectToAction("Index"); 
} 

爲編輯功能，你可以有一個控制器動作，將取得的記錄，並呈現一個視圖，將允許編輯：

public ActionResult Edit(int id) 
{ 
    var employee = objEmp.tbemployees.FirstOrDefault(x => x.Id == id); 
    if (employee == null) 
    { 
     // no employee with the specified id was found 
     return new HttpNotFound(); 
    } 
    return View(employee); 
} 

，然後你可以有一個相應的~/Views/Home/Edit.cshtml觀點：

@model Employee 
@using (Html.BeginForm()) 
{ 
    <div> 
     @Html.LabelFor(x => x.ename) 
     @Html.EditorFor(x => x.ename) 
    </div> 
    <div> 
     @Html.LabelFor(x => x.eadd) 
     @Html.EditorFor(x => x.eadd) 
    </div> 

    ... 

    <button type="submit">Save</button> 
} 

，當然還有相應的動作時更新表單提交備案：關於搜索功能

[HttpPost] 
public ActionResult Edit(Employee employee) 
{ 
    ... update the employee record 
    return RedirectToAction("Index"); 
}