将删除图标“x”添加到视图中的每个记录

时间:2012-02-14 19:01:17

标签: c# html asp.net-mvc linq-to-sql

我有一个列出学生的视图。我想在每个学生面前添加一个删除图标(红色" x")。点击删除图标将删除该学生。

我知道如何通过在文本框中输入学生ID并添加按钮来执行此操作。但我想通过点击每个学生面前的删除图标来做同样的事情。

这是我的观看代码:

<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage<dynamic>" %>
<%@ Import Namespace="Student.Models" %>

<asp:Content ID="Content3" ContentPlaceHolderID="TitleContent" runat="server">
    Student
</asp:Content>

<asp:Content ID="Content4" ContentPlaceHolderID="MainContent" runat="server">

<form id="Form1" method="get" action="/Student/RemoveStudent/" runat="server">
    <label for="id">
        Student ID:
    </label>
    <input type="text" name="studentID" value="<%=HttpContext.Current.Request.QueryString["studentID"]%>" />

    <input type="submit" value="Remove Student"/>

    </form>

    <h2>Students</h2>
        <table>
          <% foreach (Student in (IEnumerable)ViewData.Model)

          { %>
         <tr>
            <td>
               <%= s.StudentID %> 
            </td>
        </tr>
          <% } %>
    </table>

</asp:Content>

这是我的控制器动作:

public ActionResult Index()
{

    return View(_repository.ListAll().OrderByDescending(s => s.StudentName));
}

public ActionResult RemoveStudent(int studentId)
{

    StudentDataContext student = new StudentDataContext();

    var std = student.Students.Single(s => s.StudentID == studentId);
    student.Students.DeleteOnSubmit(std);
    student.SubmitChanges();
    return Content("Student" + studentId + " Removed");
}

提前致谢

1 个答案:

答案 0 :(得分:3)

对于初学者,您需要添加图片

    <table>
      <% foreach (Student in (IEnumerable)ViewData.Model)

      { %>
     <tr>
        <td>
            <%= Html.ActionLink("RemoveStudent",                // Action
                                "Students",                     // Controller
                                new { id = Student.studentId }, // Route Args
                                new { @class="deleteButton" }   // HTML Args
            ) %>
        </td>
        <td>
           <%= s.StudentID %> 
        </td>
    </tr>
      <% } %>
</table>

和一点css

a.deleteButton
{
    background: url(../Images/delete.gif) no-repeat top left;
     display: block;
     width: 50px;
     height: 50px;
     text-indent: -9999px; /* hides the link text */
}

这可以更加详细,但你明白了。您可以通过表单提交删除,并使用它传递userID等等。