ASP.NET WP - 编辑数据库数据

在本章中,我们将介绍如何创建一个网页,用户可以在其中编辑数据库的现有数据.

  • 在此过程中,我们将创建两个类似于我们之前为数据插入创建的页面.

  • 第一页显示客户列表并让用户选择他们想要更改的列表.

  • 第二页允许用户实际进行编辑并保存.

如何编辑数据库的现有数据?

让我们创建一个新的CSHTML文件该项目.

新CHSTML文件

输入在Name字段中单击EditCustomers.cshtml ,然后单击OK.

现在使用以下代码替换EditCustomers.cshtml文件.

@{
   var db = Database.Open("WebPagesCustomers");
   var selectQueryString = "SELECT * FROM Customers ORDER BY FirstName";
}

<!DOCTYPE html>
<html>
   <head>
      <title>Customers List</title>
      <style>
         table, th, td {
            border: solid 1px #bbbbbb;
            border-collapse: collapse;
            padding: 2px;
         }
      </style>
   
   </head>
   <body>
      <h1>Customers List</h1>
      <table>
         <thead>
            <tr>
               <th> </th>
               <th>First Name</th>
               <th>Last Name</th>
               <th>Address</th>
            </tr>
         </thead>
         
         <tbody>
            @foreach(var row in db.Query(selectQueryString)){
               <tr>
                  <td><a href = "@Href("~/UpdateCustomers", row.Id)">Edit</a></td>
                  <td>@row.FirstName</td>
                  <td>@row.LastName</td>
                  <td>@row.Address</td>
               </tr>
            }
         </tbody>
      </table>
   
   </body>
</html>

EditCustomers.cshtml 页面和 ListCustomers.cshtml 页面之间的唯一区别在于它包含显示编辑链接的额外列.

当您单击该编辑链接时,它将转到 UpdateCustomer.cshtml 页面,该页面尚未创建.所以我们需要创建UpdateCustomer.cshtml文件并用以下代码替换它.

@{
   Validation.RequireField("FirstName", "First Name is required.");
   Validation.RequireField("LastName", "Last Name is required.");
   Validation.RequireField("Address", "Address is required.");
   
   var FirstName = "";
   var LastName = "";
   var Address = "";
   var CustomerId = UrlData[0];

   if (CustomerId.IsEmpty()) {
      Response.Redirect("~/EditCustomers");
   }
   var db = Database.Open("WebPagesCustomers");
   
   if (IsPost && Validation.IsValid()) {
      var updateQueryString = "UPDATE Customers SET FirstName = @0, LastName = @1,
         Address = @2 WHERE Id = @3" ;
      FirstName = Request["FirstName"];
      LastName = Request["LastName"];
      Address = Request["Address"];
      db.Execute(updateQueryString, FirstName, LastName, Address, CustomerId);
      
      // Display the page that lists products.
      Response.Redirect(@Href("~/EditCustomers"));
   } else {
      var selectQueryString = "SELECT * FROM Customers WHERE ID = @0";
      var row = db.QuerySingle(selectQueryString, CustomerId);
      FirstName = row.FirstName;
      LastName = row.LastName;
      Address = row.Address;
   }
}

<!DOCTYPE html>
<html>
   <head>
      <title>Update Customer</title>
      <style type = "text/css">
         label {
            float:left; 
            width: 8em; 
            text-align: right;
            margin-right: 0.5em;
         }
         fieldset {
            padding: 1em; 
            border: 1px solid; 
            width: 50em;
         }
         legend {
            padding: 2px 4px; 
            border: 1px solid; 
            font-weight:bold;
         }
         .validation-summary-errors {
            font-weight:bold; 
            color:red;
            font-size: 11pt;
         }
      </style>
   
   </head>
   <body>
      <h1>Update Customer</h1>
      @Html.ValidationSummary("Errors with your submission:")
      
      <form method = "post" action = "">
         <fieldset>
            <legend>Update Customer</legend>
            <div>
               <label>First Name:</label>
               <input name = "FirstName" type = "text" size = "50" value = "@FirstName"/>
            </div>
            
            <div>
               <label>Last Name:</label>
               <input name = "LastName" type = "text" size = "50" value = "@LastName" />
            </div>
            
            <div>
               <label>Address:</label>
               <input name = "Address" type = "text" size = "50" value = "@Address" />
            </div>
            
            <div>
               <label> </label>
               <input type = "submit" value = "Save" class = "submit" />
            </div>
         
         </fieldset>
      </form>
   
   </body>
</html>

现在让我们运行应用程序并指定以下url :   http://localhost:36905/EditCustomers ,您将看到以下网页.

ListCustomers

正如您所看到的,它与 ListCustomer 是同一个网页,但每个记录都有额外的编辑链接.现在让我们点击任何客户的编辑链接,让我们说第一个,你会看到以下页面.

更新客户

让我们将名字从Allan更改为Steve并点击Save.

您将看到以下页面,其中包含先更新现在最后的名称,因为我们已根据名字对列表进行了排序.

Sorted列表