主攻ASP.NET MVC4.0之重生:ASP.NET MVC Web API
UserController代码：
using GignSoft.Models;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Net.Http;
using System.Web.Http; namespace GignSoft.Controllers
{
public class UserController : ApiController
{
private readonly GignSoftDataContext context = new GignSoftDataContext(); public IEnumerable<SysUser> Get()
{
return context.SysUser;
} public SysUser Get(int id)
{
return context.SysUser.FirstOrDefault(c => c.SysUserID == id);
} public void Put(SysUser sysuser)
{
Guid gid = Guid.NewGuid();
sysuser.SysUserID = gid.GetHashCode();
context.SysUser.InsertOnSubmit(sysuser);
context.SubmitChanges();
} public void Post(SysUser sysuser)
{
Delete(sysuser.SysUserID);
context.SysUser.InsertOnSubmit(sysuser);
context.SubmitChanges();
}
public void Delete(int id)
{
SysUser sysuser = context.SysUser.FirstOrDefault(c => c.SysUserID == id);
context.SysUser.DeleteOnSubmit(sysuser);
context.SubmitChanges();
}
}
}
视图代码:
@{
ViewBag.Title = "Index";
}
<script type="text/javascript">
function altRows(id) {
if (document.getElementsByTagName) {
var table = document.getElementById(id);
var rows = table.getElementsByTagName("tr");
for (i = ; i < rows.length; i++) {
if (i % == ) {
rows[i].className = "evenrowcolor";
} else {
rows[i].className = "oddrowcolor";
}
}
}
}
window.onload = function () {
altRows('alternatecolor');
}
</script>
<style type="text/css">
table.altrowstable {
font-family: verdana,arial,sans-serif;
font-size: 11px;
color: #;
border-width: 1px;
border-color: #a9c6c9;
border-collapse: collapse;
}
table.altrowstable th {
border-width: 1px;
padding: 8px;
border-style: solid;
border-color: #a9c6c9;
}
table.altrowstable td {
border-width: 1px;
padding: 8px;
border-style: solid;
border-color: #a9c6c9;
}
.oddrowcolor {
background-color: #d4e3e5;
}
.evenrowcolor {
background-color: #c3dde0;
}
</style>
<html>
<head>
<title>用户管理</title>
<script src="~/Content/Scripts/jquery-1.7.1.js"></script>
<script src="~/Content/Scripts/knockout-2.1.0.js"></script>
</head>
<body>
<div id="user">
<table rules="all" class="altrowstable" id="alternatecolor">
<tr>
<th>编号</th>
<th>用户名</th>
<th>密码</th>
<th>创建时间</th>
<th>状态</th>
<th></th>
</tr>
<tbody>
<tr>
<td data-bind="text: SysUserID" />
<td>
<input type="text" class="textbox long" data-bind="value: LogName" />
</td>
<td>
<input type="text" class="textbox long" data-bind="value: PassWord" />
</td>
<td data-bind="text: CreateTime" />
<td data-bind="text: State" />
<td>
<a href="#" data-bind="click: $root.updateContact">修改</a>
<a href="#" data-bind="click: $root.deleteContact">删除</a>
</td>
</tr>
<tr data-bind="with: addedContact">
<td>
<input type="text" class="textbox" data-bind="value: SysUserID" />
</td>
<td>
<input type="text" class="textbox" data-bind="value: LogName" />
</td>
<td>
<input type="text" class="textbox long" data-bind="value: PassWord" />
</td>
<td>
<input type="text" class="textbox" data-bind="value: CreateTime" />
</td>
<td>
<input type="text" class="textbox" data-bind="value: State" />
</td>
<td>
<a href="#" data-bind="click: $root.addContact">添加</a>
</td>
</tr>
</tbody>
</table>
</div>
<script type="text/javascript">
function ContactViewModel() {
self = this;
self.allContacts = ko.observableArray();
self.addedContact = ko.observable();
self.loadContacts = function () {
$.get("/api/user", null, function (data) {
self.allContacts(data);
var emptyContact = { SysUserID: "", LogName: "", PassWord: "", CreateTime: "", State: "" };
self.addedContact(emptyContact);
});
};
self.addContact = function (data) {
if (!self.validate(data)) {
return;
}
$.ajax({
url: "/api/user/",
data: self.addedContact(),
type: "PUT",
success: self.loadContacts
});
};
self.updateContact = function (data) {
$.ajax({
url: "/api/user/",
data: data,
type: "POST",
success: self.loadContacts
});
};
self.deleteContact = function (data) {
$.ajax({
url: "/api/user/" + data.SysUserID,
type: "DELETE",
success: self.loadContacts
});
};
self.validate = function (data) {
if (data.LogName && data.PassWord && data.State) {
return true;
}
alert("请输入全部完整信息!");
return false;
}
self.loadContacts();
}
ko.applyBindings(new ContactViewModel());
</script>
</body>
</html>
使用效果:
参考书本：
ASP.NET MVC 4框架揭秘
代码资料来源：
通过ASP.NET Web API + JQuery创建一个简单的Web应用
通过Knockout.js + ASP.NET Web API构建一个简单的CRUD应用
http://www.cnblogs.com/artech/archive/2012/07/04/Knockout-web-api.html
http://www.cnblogs.com/artech/archive/2012/05/14/web-api-demo.html
主攻ASP.NET MVC4.0之重生:ASP.NET MVC Web API的更多相关文章
- 主攻ASP.NET MVC4.0之重生:ASP.NET MVC使用JSONP
原文:主攻ASP.NET MVC4.0之重生:ASP.NET MVC使用JSONP 原文地址 http://www.codeguru.com/csharp/.net/net_asp/using-jso ...
- 主攻ASP.NET MVC4.0之重生:Asp.Net MVC WebApi OData
1.新建MVC项目,安装OData Install-Package Microsoft.AspNet.WebApi.OData -Version 4.0.0 2.新建WebAPI Controller ...
- 主攻ASP.NET MVC4.0之重生:Jquery Mobile 列表
代码: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title ...
- 主攻ASP.NET MVC4.0之重生:Jquery Mobile 表单元素
相关代码: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <tit ...
- 主攻ASP.NET MVC4.0之重生:Jquery Mobile 按钮+对话框使用
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- 主攻ASP.NET MVC4.0之重生:CheckBoxListHelper和RadioBoxListHelper的使用
在项目中新建Helpers文件夹,创建CheckBoxListHelper和RadioBoxListHelper类. CheckBoxListHelper代码 using System; using ...
- 主攻ASP.NET MVC4.0之重生:MVC Controller修改Controller.tt模版,自动添加版本注释信息
第一步找到MVC 4.0 CodeTemplates 一般路径在:C:\Program Files (x86)\Microsoft Visual Studio 11.0\Common7\IDE\Ite ...
- 主攻ASP.NET MVC4.0之重生:上下滑动屏幕动态加载数据
@{ ViewBag.Title = "Index"; } <!DOCTYPE html> <html> <head> ...
- 主攻ASP.NET MVC4.0之重生:使用反射获取Controller的ActionResult
示例代码 public ActionResult TypeOfForName() { Type typeinfo = typeof(CustomerClassController); //typeof ...
随机推荐
- java 获取网页指定内容-2（实践+修改）
import java.io.BufferedReader; import java.io.InputStreamReader; import java.net.HttpURLConnection; ...
- 表单中method="post"什么意思？
表示表单中的数据以"post"方法传递.Form提供了两种数据传输的方式——get和post.虽然它们都是数据的提交方式,但是在实际传输时确有很大的不同,并且可能会对数据产生严重的 ...
- 使用Salt-ssh部署Salt-minion之yum安装（一）
一.RPM安装篇 使用salt-ssh功能要求客户端系统python版本2.6+ 1.salt-minion端环境: 系统:CentOS 6.5 64bit python版本:2.6.6 2.配置/e ...
- 使用神器MobaXterm连接远程mysql和redis
https://mobaxterm.mobatek.net/download-home-edition.html mysql redis 连接测试 mysql 127.0.0.1 3307 密码使用线 ...
- composer爆错：zlib_decode():data error
昨晚用nginx运行Yii的一个开源小项目,结果composer安装依赖一直报错,如下 Failed to decode response: zlib_decode(): data error 如果遇 ...
- 5、easyUI-菜单与按钮
列出源码:求解 <html> <head> <meta http-equiv="Content-Type" content="text/ht ...
- mock数据（模拟后台数据）
mock数据(模拟后台数据) - Emily恩 - 博客园 https://www.cnblogs.com/enboke/p/vue.html Mock.js http://mockjs.com/ 前 ...
- Java的OO与多态
this的用法 class Banana { void f(int i) {} }Banana a = new Banana(), b = new Banana();a.f(1);b.f(2);若只有 ...
- mono下c#和c交互，字符串处理
起因是ulua里,从luajit读字符串到c#里,做了编码转换,如下 public static string lua_tostring(IntPtr luaState, int index) { v ...
- 【24】response对象以及Python3中的一些变化
request.COOKIES 用来获取cookie response.write() 写的方法是response对象的 转自:博客园python3的变化 print 由一个语句(st ...