网络编程 
首页 > 网络编程 > 浏览文章

JQuery对ASP.NET MVC数据进行更新删除

(编辑:jimmy 日期: 2024/11/20 浏览:3 次 )

以前学习ASP.NET MVC时,学习与应用,操作过数据显示,添加,编辑,更新和删除等功能。
很多方法是相通的,看自己是怎样来进行方便,快捷,高效率。
今天Insus.NET写的练习,是直接对绑定在Table的数据进行更新,删除。
在项目中,创建一个实体,也就是说,对数据库时行通信,对数据进行操作:

JQuery对ASP.NET MVC数据进行更新删除

public IEnumerable<ToolLocation> GetAllToolLocations()
  {
   sp.ConnectionString = DB.ConnectionString;
   sp.Parameters = null;
   sp.ProcedureName = "usp_ToolLocation_GetAll";
   DataTable dt = sp.ExecuteDataSet().Tables[0];
   return dt.ToList<ToolLocation>();
  }

  public void Update(ToolLocation tl)
  {
   List<Parameter> param = new List<Parameter>() {
         new Parameter("@ToolLocation_nbr", SqlDbType.SmallInt, 2, tl.ToolLocation_nbr),
         new Parameter("@LocationName",SqlDbType.NVarChar,-1,tl.LocationName),
         new Parameter("@Description",SqlDbType.NVarChar,-1,tl.Description),
         new Parameter("@IsActive",SqlDbType.Bit,1,tl.IsActive)
   };
   sp.ConnectionString = DB.ConnectionString;
   sp.Parameters = param;
   sp.ProcedureName = "usp_ToolLocation_Update";
   sp.Execute();
  }

  public void Delete(ToolLocation tl)
  {
   List<Parameter> param = new List<Parameter>() {
         new Parameter("@ToolLocation_nbr", SqlDbType.SmallInt, 2, tl.ToolLocation_nbr)
   };
   sp.ConnectionString = DB.ConnectionString;
   sp.Parameters = param;
   sp.ProcedureName = "usp_ToolLocation_Delete";
   sp.Execute();
  }

在项目的控制器中:

JQuery对ASP.NET MVC数据进行更新删除

创建视图,并绑定数据:

JQuery对ASP.NET MVC数据进行更新删除

@using Insus.NET.Models;
@model IEnumerable<ToolLocation>

<!DOCTYPE html>
<html>
<head>
 <meta name="viewport" content="width=device-width" />
 <title>Edit</title>
 <link href="~/Content/css/table.css" rel="stylesheet" />
 <script src="/UploadFiles/2021-04-02/jquery-2.2.1.js">

Source Code

上面步骤#4的jQuery代码:

JQuery对ASP.NET MVC数据进行更新删除

运行一下,看看效果:

JQuery对ASP.NET MVC数据进行更新删除

上面是对数据进行更新的功能,下面的实现,是对Table内的数据删除。

JQuery对ASP.NET MVC数据进行更新删除

@using Insus.NET.Models;
@model IEnumerable<ToolLocation>

<!DOCTYPE html>

<html>
<head>
 <meta name="viewport" content="width=device-width" />
 <title>Delete</title>
 <link href="~/Content/css/table.css" rel="stylesheet" />
 <script src="/UploadFiles/2021-04-02/jquery-2.2.1.js">

上面标记#4的jQuery代码,即是删除的核心功能:

JQuery对ASP.NET MVC数据进行更新删除

运行程序,看看删除的效果:

JQuery对ASP.NET MVC数据进行更新删除

删除成功之后,我们不必重导向,只需要删除这行html即可,来达到:

JQuery对ASP.NET MVC数据进行更新删除

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。

上一篇:jQuery EasyUI菜单与按钮详解
下一篇:Javascript表单特效之十大常用原理性样例代码大总结