看了很久终于有点眉目了。
首先建一个项目Asp.net MVC4 Web Application下的Web Api项目;
在Controllers文件夹下新建一个类(继承 ApiController)
public class UserController : ApiController
{
public IQueryable<User> Get()
{
return List.AsQueryable();
}
public User Get(string id)
{
User user = List.Single<User>(u => u.userNo == id);
if (user != null)
{
return user;
}
return user;
}
public bool Post(User user)
{
if (user != null)
{
List.Add(user);
return true;
}
return false;
}
public bool Put(User user)
{
if (user != null)
{
User u = List.Single<User>(mu => mu.userNo == user.userNo);
List.Remove(u);
List.Add(user);
return true;
}
return false;
}
public bool Delete(string id)
{
if (id != null)
{
User u = List.Single<User>(mu => mu.userNo == id);
List.Remove(u);
return true;
}
return false;
}
/// <summary>
/// 测试数据
/// </summary>
private static List<User> List = new List<User>();
public class User
{
public string userNo { get; set; }
public string Name { get; set; }
public string Pwd { get; set; }
}
}
需要注意一下方法名(get ,post,put,delete)和参数名(string id)和Global.asax对应。
客户端代码:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="MvcApplication5.Views.WebForm1" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<script type="text/javascript" src="Scripts/jquery-1.6.2.min.js"></script>
<title></title>
<script type="text/javascript">
function find() {
var id = $("#uId").val();
if (id != "") {
$.ajax({
type: "GET",
url: "http://localhost:2930/api/user/" + id,
dataType: "json",
success: function (data) {
if (data != 0) {
var str = "编号:" + data.userNo + " 姓名:" + data.Name + "<br/>";
$("#user").html(str);
}
else {
$("#user").html("");
}
}
})
}
else {
$.ajax({
type: "GET",
url: "http://localhost:2930/api/user/",
dataType: "json",
success: function (data) {
if (data != 0) {
var str = "";
$.each(data, function (i) {
str += "编号:" + data[i].userNo + " 姓名:" + data[i].Name + "<br/>";
})
$("#user").html(str);
}
else {
$("#user").html("");
}
}
})
}
}
function Add() {
var no = $("#txtno").val();
var name = $("#txtname").val();
$.ajax({
type: "POST",
dataType: "json",
url: "http://localhost:2930/api/user/",
data: { userNo: no, Name: name,Pwd:"000000" },
success: function (data) {
alert(data.toString());
},
error:function(data) {
alert(data.toString());
alert("出错了");
}
})
}
function Edit() {
var no = $("#txtno").val();
var name = $("#txtname").val();
$.ajax({
type: "PUT",
dataType: "json",
url: "http://localhost:2930/api/user/",
data: { userNo: no, Name: name, Pwd: "000000" },
success: function (data) {
alert(data.toString());
},
error: function (data) {
alert(data.toString());
alert("出错了");
}
})
}
function Del() {
var id = $("#txtno").val();
$.ajax({
type: "Delete",
dataType: "json",
url: "http://localhost:2930/api/user/"+id,
success: function (data) {
alert("删除成功");
},
error: function (data) {
alert(data.toString());
alert("出错了");
}
})
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<h1>所有用户</h1>
<ul id='users' />
</div>
<div>
<label>ID:</label>
<input type="text" id="uId" size="5" />
<input type="button" value="查找" onclick="find();" />
<input type="button" value="删除" onclick="Del();" />
<p id="user" />
</div>
<div>
<label>ID:</label>
<input type="text" id="txtno" name="txtno" size="5" />
<label>姓名:</label>
<input type="text" id="txtname" name="txtname" size="5" />
<input type="button" value="提交" onclick="Add();" />
<input type="button" value="修改" onclick="Edit();" />
<p id="P1" />
</div>
</form>
</body>
</html>
好像其他没啥要改的,初步就这样吧。