JQuery对ASP.NET MVC数据进行更新删除
以前学习ASP.NET MVC时,学习与应用,操作过数据显示,添加,编辑,更新和删除等功能。
很多方法是相通的,看自己是怎样来进行方便,快捷,高效率。
今天Insus.NET写的练习,是直接对绑定在Table的数据进行更新,删除。
在项目中,创建一个实体,也就是说,对数据库时行通信,对数据进行操作:
public IEnumerable<ToolLocation> GetAllToolLocations()
{
sp.ConnectionString = DB.ConnectionString;
sp.Parameters = null;
sp.ProcedureName = "usp_ToolLocation_GetAll";
DataTable dt = sp.ExecuteDataSet().Tables[];
return dt.ToList<ToolLocation>();
} public void Update(ToolLocation tl)
{
List<Parameter> param = new List<Parameter>() {
new Parameter("@ToolLocation_nbr", SqlDbType.SmallInt, , tl.ToolLocation_nbr),
new Parameter("@LocationName",SqlDbType.NVarChar,-,tl.LocationName),
new Parameter("@Description",SqlDbType.NVarChar,-,tl.Description),
new Parameter("@IsActive",SqlDbType.Bit,,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, , tl.ToolLocation_nbr)
};
sp.ConnectionString = DB.ConnectionString;
sp.Parameters = param;
sp.ProcedureName = "usp_ToolLocation_Delete";
sp.Execute();
}
Source Code
在项目的控制器中:
创建视图,并绑定数据:
@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="~/Scripts/jquery-2.2.1.js"></script> </head>
<body>
<div>
<table>
<tr>
<td>ToolLocation_nbr</td>
<td>LocationName</td>
<td>Description</td>
<td>IsActive</td>
<td></td>
</tr>
@foreach (var tl in Model)
{
<tr>
<td>@tl.ToolLocation_nbr<input id="Hidden1" type="hidden" value="@tl.ToolLocation_nbr" /></td>
<td>@Html.TextBox("LocationName", tl.LocationName)</td>
<td>@Html.TextBox("Description", tl.Description) </td>
<td>@Html.CheckBox("IsActive", tl.IsActive)</td>
<td>
<input class="Update" type="button" title="Update" value="Update" />
</td>
</tr>
}
</table>
</div>
</body>
</html>
Source Code
上面步骤#4的jQuery代码:
运行一下,看看效果:
上面是对数据进行更新的功能,下面的实现,是对Table内的数据删除。
@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="~/Scripts/jquery-2.2.1.js"></script> </head>
<body>
<div>
<table>
<tr>
<td>ToolLocation_nbr</td>
<td>LocationName</td>
<td>Description</td>
<td>IsActive</td>
<td></td>
</tr>
@foreach (var tl in Model)
{
<tr>
<td>@tl.ToolLocation_nbr<input id="Hidden1" type="hidden" value="@tl.ToolLocation_nbr" /></td>
<td>@tl.LocationName</td>
<td>@tl.Description</td>
<td>@Html.CheckBox("IsActive", tl.IsActive, new { disabled = "disabled" })</td>
<td>
<input class="Delete" type="button" title="Delete" value="Delete" />
</td>
</tr>
}
</table>
</div>
</body>
</html>
Source Code
上面标记#4的jQuery代码,即是删除的核心功能:
运行程序,看看删除的效果:
以下内容于2016-07-12 16:05分更新
删除成功之后,我们不必重导向,只需要删除这行html即可,来达到:
JQuery对ASP.NET MVC数据进行更新删除的更多相关文章
- [渣译文] 使用 MVC 5 的 EF6 Code First 入门 系列:为ASP.NET MVC应用程序更新相关数据
这是微软官方教程Getting Started with Entity Framework 6 Code First using MVC 5 系列的翻译,这里是第八篇:为ASP.NET MVC应用程序 ...
- ASP.NET MVC应用程序更新相关数据
为ASP.NET MVC应用程序更新相关数据 这是微软官方教程Getting Started with Entity Framework 6 Code First using MVC 5 系列的翻译, ...
- 七天学会ASP.NET MVC (二)——ASP.NET MVC 数据传递
通过第一天的学习之后,我们相信您已经对MVC有一些基本了解. 本节所讲的内容是在上节的基础之上,因此需要确保您是否掌握了上一节的内容.本章的目标是在今天学习结束时利用最佳实践解决方案创建一个小型的MV ...
- 七天学会ASP.NET MVC (二)——ASP.NET MVC 数据传递 【转】
http://www.cnblogs.com/powertoolsteam/p/MVC_two.html 通过第一天的学习之后,我们相信您已经对MVC有一些基本了解. 本节所讲的内容是在上节的基础之上 ...
- ASP.NET MVC EF直接更新数据(不需查询)
EF(EntityFrameWork) ORM(对象关系映射框架/数据持久化框架),根据实体对象操作数据表中数据的一种面向对象的操作框架,底层也是调用ADO.NET ASP.NET MVC 项目会自动 ...
- 如何使用jQuery向asp.net Mvc传递复杂json数据
jQuery提供的ajax方法能很方便的实现客户端与服务器的异步交互,在asp.net mvc 框架使用jQuery能很方便地异步获取提交数据,给用户提供更好的体验! 调用jQuery的ajax方法时 ...
- ASP.NET MVC图片管理(更新)
Insus.NET在ASP.NET MVC专案中,实现了图片管理,上传,预览,显示,删除等功能,还差一个功能,就是更新图片的功能,那这次来完成它.你可以先参考前2篇<ASP.NET MVC图片管 ...
- 【转】ASP.NET MVC 数据验证及相关内容
原文地址:http://www.jb51.net/article/56713.htm 一.数据验证 数据验证的步骤在模型类中添加与验证相关的特性标记在客户端导入与验证相关的js文件和css文件使用与验 ...
- asp.net mvc数据验证
文章:asp.net mvc3 的数据验证(一) 文章:ASP.NET MVC下的四种验证编程方式 这个讲了在一个地方展示验证信息 文章:[ASP.NET MVC系列]浅谈数据注解和验证 这个在每个输 ...
随机推荐
- Alpha阶段冲刺项目总结(补充)
Alpha阶段冲刺阶段总结(补充) 此篇博客为"作业七:Alpha版本冲刺阶段" 与 "作业八:Alpha阶段项目总结" 的总结版. 一.项目预期计划vs实际进 ...
- 作业二:Github注册过程
第一步.打开Github官网https://github.com/ ,在相应位置填写注册名.注册邮箱.注册密码完成后点击注册. 第二步.这时会弹出一个界面,让你选择你的私人计划(personal pl ...
- Angular Input格式化
今天在Angular中文群有位同学问到:如何实现对input box的格式化.如下的方式对吗? <input type="text" ng-model="demo. ...
- 【开源】开发者新闻聚合APP 2.0.3发布(第二个稳定版本)
聚合了博客园新闻.infoq新闻.36kr新闻.oschina新闻.51cto新闻.csdn新闻: 争取做到随时刷随时有开发者的新闻! 目前还只支持安卓APP 但用的人多了,我会发布苹果版的APP 最 ...
- 在此记录一下SharpGL最初创建的程序
在此记录一下SharpGL最初创建的程序.完整工程在此. /// <summary> /// The main form class. /// </summary> publi ...
- Git学习笔记(4)——添加远程仓库,克隆远程库,以及库的推送
本文记录了远程库的连接和库的克隆和推送. 远程仓库简介 Git是分布式版本控制系统,同一个Git仓库,可以分布到不同的机器上.有一台机器有一个原始版本库,此后,别的机器可以“克隆”这个原始版本库,而且 ...
- Java连接Oracle数据库开发银行管理系统【一、需求篇】
此系统开发共分为三篇完成. 第一篇[需求篇]:效果展示图,也就是需求部分的展示 第二篇[设计篇]:需求分析和类,接口的设计 第三篇[实现篇]:具体代码实现
- Android开发学习之路-抢红包助手开发全攻略
背景:新年之际,微信微博支付宝红包是到处飞,但是,自己的手速总是比别人慢一点最后导致红包没抢到,红包助手就应运而生. 需求:收到红包的时候进行提醒,然后跳转到红包的界面方便用户 思路:获取“读取通知信 ...
- Bootstrap的学习
Bootstrap 是一个用于快速开发 Web 应用程序和网站的前端框架. Bootstrap 是基于 HTML.CSS.JAVASCRIPT <link href="http://c ...
- 从双十一战报看传统大家电如何O2O转型?
说到大家电电商,大家都会想起天猫.京东.苏宁易购.国美在线等各大电商平台,他们这一次的双十一又实现了较大规模的增长,而各大电商平台家电辉煌战绩的背后实际上是各大品牌家电的成功. 格力今年双十一当天创下 ...