跨域的CRUD

--MVC

--控制器

using System;
using System.Collections.Generic;
using System.Linq;
using System.Net.Http;
using System.Web;
using System.Web.Mvc;
using Newtonsoft.Json;
using Webdiyer.WebControls.Mvc;

namespace BookSetMvc.Controllers
{
public class BookMVCController : Controller
{
// GET: BookMVC
public ActionResult Index(string name="",int indexpage=1)
{
Uri url = new Uri("http://localhost:49711/");
HttpClient CL = new HttpClient();
CL.BaseAddress = url;
CL.DefaultRequestHeaders.Accept.Add(new System.Net.Http.Headers.MediaTypeWithQualityHeaderValue("application/json"));
HttpResponseMessage message = CL.GetAsync("api/BookAPI/").Result;
if (message.IsSuccessStatusCode)
{
var list = message.Content.ReadAsStringAsync().Result;
List<BOOKSET> resalt = JsonConvert.DweserializeObject<List<BOOKSET>>(list);
if (name=="")
{
return View(resalt.ToPagedList(indexpage,5));
}
else
{
List<BOOKSET> p =(resalt.Where(T => T.Name.Contains(name))).ToList();
return View(p.ToPagedList(indexpage,5));
}


}
else
{
return View();
}

}

public ActionResult AddBook(int id)
{
return View();
}


}
}
public class BOOKSET
{
public int ID { get; set; }
public string Name { get; set; }
public int Num { get; set; }
public int Price { get; set; }
}

--前台

--首页


@{
Layout = null;
}
@using Webdiyer.WebControls.Mvc;
@model PagedList<BOOKSET>
<!DOCTYPE html>

<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Index</title>
<script src="~/Scripts/jquery-1.10.2.min.js"></script>
</head>
<body>
<div>
<input id="name" placeholder="请输入书名"/><input type="button"onclick="sel()" value="模糊查询"/>
<table border="1" style="text-align:center;">
<tr style="text-align:right;"><td align="right" colspan="5"><input type="button" value="新增图书" onclick="add()" /></td></tr>
<tr>
<td>编号</td>
<td>书名</td>
<td>价格</td>
<td>库存</td>
<td>操作</td>
</tr>
@foreach (var item in Model)
{
<tr>
<td>@item.ID</td>
<td>@item.Name</td>
<td>@item.Price</td>
<td>@item.Num</td>
<td>
<a href="#" onclick="del(@item.ID)">删除</a>
<a href="#" onclick="upt(@item.ID)">更新</a>
</td>
</tr>
}
</table>
@Html.Pager(Model,new PagerOptions() { PageIndexParameterName= "indexpage" })
</div>
</body>
</html>
<script>
function sel()
{
location.href="/BookMVC/Index/?name="+document.getElementById("name").value;
}
function del(id)
{
if (confirm("确定要删除吗?"))
{

$.ajax({
url: "http://localhost:49711/api/BookAPI/"+id,
type:"Delete",
success: function (data) {
if (data == 1)
{
alert("删除成功");
location.href = "/BookMVC/Index";

}
else {
alert("删除失败");
}
}
});
}

}
function add()
{
location.href = "/BookMVC/AddBook/?id="+0;
}
function upt(id)
{
location.href = "/BookMVC/AddBook/?id=" +id;
}

</script>

--前台添加修改


@{
Layout = null;
}

<!DOCTYPE html>

<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>AddBook</title>
<script src="~/Scripts/jquery-1.10.2.min.js"></script>
</head>
<body>
<div>
<h1>新增图书</h1>
<p>
图书名称:<input id="name"/>
</p>
<p>
图书价格:<input id="price"/>
</p>
<p>
图书库存:<input id="num"/>
</p>
<p>
<input type="button" value="提交" onclick="addorupt()"/>
</p>
</div>
</body>
</html>
<script>
$(function () {
var index = location.search;
var id = index.substring(index.lastIndexOf("=") + 1);
if (id == 0 || id == null || id == "") {
return;
}
else {
$.ajax({
url: "http://localhost:49711/api/BookAPI/" + id,
type: "Get",
success: function (data)
{
$("#name").val(data.Name);
$("#price").val(data.Price);
$("#num").val(data.Num);
return;
}
});
}
});
function addorupt()
{
var index = location.search;
var id = index.substring(index.lastIndexOf("=") + 1);
if (id == 0 || id == null || id == "")
{
id = 0;
$.ajax({
url: "http://localhost:49711/api/BookAPI/" + id,
type: "Put",
data: { Name: $("#name").val(), Price: $("#price").val(), Num:$("#num").val()},
success: function (data)
{
if (data == 0)
{
alert("添加失败");
}
else
{
alert("添加成功");
location.href = "/BookMVC/Index";
}
}
});
}
else
{
$.ajax({
url: "http://localhost:49711/api/BookAPI/" + id,
type: "Put",
data: { Name: $("#name").val(), Price: $("#price").val(), Num: $("#num").val() },
success: function (data) {
if (data == 0) {
alert("修改失败");
}
else {
alert("修改成功");
location.href = "/BookMVC/Index";
}
}
});
}
}
</script>

原文地址:https://www.cnblogs.com/xing-xing/p/7884409.html