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系列]浅谈数据注解和验证 这个在每个输 ...
随机推荐
- java提高篇(二二)---LinkedList
一.概述 LinkedList与ArrayList一样实现List接口,只是ArrayList是List接口的大小可变数组的实现,LinkedList是List接口链表的实现.基于链表实现的方式使得L ...
- java提高篇(十四)-----字符串
可以证明,字符串操作是计算机程序设计中最常见的行为. 一.String 首先我们要明确,String并不是基本数据类型,而是一个对象,并且是不可变的对象.查看源码就会发现String类为f ...
- C#将dll打包到程序中
最近比较懒,加上内容也不多就懒得排版了,字放大了,看起来应该方便一点 直接进入主题 先来看一个栗子,假设现在有一个第三方dll namespace TestLibrary1 { public clas ...
- 解析for循环
循环的作用就是让一个程序.连续进行一遍又一遍的循环: for循环: 分为四大类: 初始状态:相当于他一开始的数值,或条件: 循环条件:满足进行循环,不满足则停止: 循环体:循环的东西,程序: 状态改变 ...
- Linux初学 - head,tail,grep,sed,yum,find
head 查看文件头部 -n 指定查看行数 默认10行 tail 查看文件尾部 n 指定查看行数 默认10行 Grep 命令 用法大全 . 参数: -I :忽略大小写 -c :打印匹配的行数 -l : ...
- artTemplate 这么叼
artTemplate 这么叼 高性能JavaScript模板引擎原理解析 http://www.itfeed.com/blog/10016.html
- cordova添加plugin
cordova添加plugin #在线安装 cordova create chankoujie com.example.chankoujie ChanKouJie cordova plugin add ...
- IDE:Eclipse查看Servlet源码
一.源码下载 1.打开tomcat官网:http://tomcat.apache.org/ , 点击右侧下载菜单(以tomcat-7为例)进入下载页面:http://tomcat.apache. ...
- 为什么说基于TCP的移动端IM仍然需要心跳保活?
1.前言 很多人认为,TCP协议自身先天就有KeepAlive机制,为何基于它的通讯链接,仍然需要在应用层实现额外的心跳保活?本文将从移动端IM实践的角度告诉你,即使使用的是TCP协议,应用层的心跳保 ...
- viewpage listview gridview加载本地大图多图OOM处理办法
很少上博客园写东西了. 最近在写公司项目,由于需要加载本地相册通过viewpager方式来加载, 最后发现直接进入界面就OOM了. 经过几天的整理最终搞定. 现在将加载本地和加载网络图片的缓存工具类贴 ...