API

using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Net.Http;
using System.Web.Http;
using System.Web.Http.Cors;
using yue5API.Models;

namespace yue5API.Controllers
{
[EnableCors("*", "*", "*")]
public class BookApiController : ApiController
{
// GET: api/BookApi
yue5DBEntities db = new yue5DBEntities();
public IEnumerable<stu> Get()
{
return db.stus.ToList();
}

// GET: api/BookApi/5
public stu Get(int id)
{
var tt = db.stus.Where(s => s.ID == id).FirstOrDefault();

return tt;
}

// POST: api/BookApi
public void Post([FromBody]stu value)
{
db.stus.Add(value);
db.SaveChanges();
}

// PUT: api/BookApi/5
public void Put(int id, [FromBody]stu value)
{
var tt = db.stus.Where(s => s.ID == id).FirstOrDefault();
if (tt != null)
tt.ID = value.ID;
tt.Name = value.Name;
tt.Num = value.Num;
tt.Price = value.Price;
db.SaveChanges();
}

// DELETE: api/BookApi/5
public HttpResponseMessage Delete(int id)
{
var tt = db.stus.Where(s => s.ID == id).FirstOrDefault();
if (tt != null)
{
db.stus.Remove(tt);
db.SaveChanges();
return new HttpResponseMessage() { StatusCode = HttpStatusCode.OK };
}
else
{
return new HttpResponseMessage() { StatusCode = HttpStatusCode.NoContent };
}
}
}
}

MVC

using System;
using System.Collections.Generic;
using System.Linq;
using System.Net.Http;
using System.Web;
using System.Web.Mvc;
using yue5MVC.Models;
using Newtonsoft.Json;
namespace yue5MVC.Controllers
{
public class showController : Controller
{

//显示
// GET: show
public ActionResult Index()
{
Uri uri = new Uri("http://localhost:4970");
HttpClient client = new HttpClient();
client.BaseAddress = uri;
client.DefaultRequestHeaders.Accept.Add(new System.Net.Http.Headers.MediaTypeWithQualityHeaderValue("application/json"));
HttpResponseMessage message=client.GetAsync("api/BookApi").Result;
List<All> tt = new List<All>();
if (message.IsSuccessStatusCode)
{
string pp = message.Content.ReadAsStringAsync().Result;
tt = JsonConvert.DeserializeObject<List<All>>(pp);
}
client.Dispose();

return View(tt);
}
public ActionResult add()
{
return View();
}

//删除
public ActionResult shan(int id)
{
Uri uri = new Uri("http://localhost:4970");
HttpClient client = new HttpClient();
client.BaseAddress = uri;
client.DefaultRequestHeaders.Accept.Add(new System.Net.Http.Headers.MediaTypeWithQualityHeaderValue("application/json"));
HttpResponseMessage message = client.DeleteAsync("api/BookApi/"+id).Result;

if (message.IsSuccessStatusCode)
{
return Content("<script>alert('删除成功');location.href='/show/Index'</script>");
}
else
{
return Content("<script>alert('删除失败')</script>");
}
}

//修改
public ActionResult xiu(int id)
{
ViewBag.id = id;

return View();
}

}
}

前台修改

@{
Layout = null;
}

<!DOCTYPE html>

<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>xiu</title>
<script src="~/Scripts/jquery-1.10.2.min.js"></script>
</head>
<body>
<div>
<p>名称:<input id="txtname" type="text" name="Name" /></p>
<p>数量:<input id="txtnum" type="text" name="Num" /></p>
<p>价格:<input id="txtprice" type="text" name="Price" /></p>
<input id="Submit1" type="submit" value="sub修改" />
<input id="Button1" type="button" value="修改" onclick="xiu()" />
<script>
$(function () {
show();
})
function show() {
var id = '@ViewBag.id';
$.ajax({
url: "http://localhost:4970/api/Bookapi/"+id,
type: "Get",
success: function (data) {
$("#txtname").val(data.Name);
$("#txtnum").val(data.Num);
$("#txtprice").val(data.Price);
}

})
}
function xiu() {
var id = '@ViewBag.id';
$.ajax({
url: "http://localhost:4970/api/Bookapi/"+id,
type: "Put",
data:{ID:id,Name:$("#txtname").val(),Num:$("#txtnum").val(),Price:$("#txtprice").val()},
success: function (data) {
alert("修改成功");
location.href = '/show/Index';
}

})

}
</script>
</div>
</body>
</html>

添加

@{
Layout = null;
}

<!DOCTYPE html>

<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>add</title>
<script src="~/Scripts/jquery-1.10.2.min.js"></script>
</head>
<body>
<div>
<p>名称:<input id="txtname" type="text" /></p>
<p>数量:<input id="txtnum" type="text" /></p>
<p>价格:<input id="txtprice" type="text" /></p>
<input id="Button1" type="button" value="添加" onclick="tian()" />
<script>
function tian() {
$.ajax({
url: "http://localhost:4970/api/Bookapi",
type: "Post",
dataType: "json",
data: { Name: $("#txtname").val(), Num: $("#txtnum").val(), Price: $("#txtprice").val() },
success: function (data) {
alert("添加成功");
location.href = '/show/Index';
}

})
}
</script>
</div>
</body>
</html>

显示

@{
Layout = null;
}
@model List<yue5MVC.Models.All>
<!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>
<table>
<tr>
<td>名称</td>
<td>数量</td>
<td>价格</td>
<td>操作</td>
</tr>
<tbody>
@foreach (var item in Model)
{
<tr>
<td>@item.Name</td>
<td>@item.Num</td>
<td>@item.Price</td>
<td><a href="#" onclick="shan(@item.ID)">删除</a>
<a href="/show/xiu/@item.ID">修改</a></td>
</tr>

}
</tbody>
</table>
<table id="show"></table>
<script>
$(function () {
show();
})
function show() {

$.ajax({
url: "http://localhost:4970/api/Bookapi/"+id,
type: "Get",
success: function (data) {

var str = "";

str += "<tr><td>" + data.Name+ "</td></tr>";
str += "<tr><td>" + data.Num + "</td></tr>";
str += "<tr><td>" + data.Price + "</td></tr>";

$("#show").val();
}

})
function shan(id){

location.href='/show/shan?id='+id;
}
</script>
</div>
</body>
</html>

MVC跨域API的更多相关文章

  1. 跨域API

    跨域API 简单跨域请求 只需要简单的设置允许跨域就可以了 def set_default_headers(self): self.set_header('Access-Control-Allow-O ...

  2. Angular2中对ASP.NET MVC跨域访问

    应用场景 项目开发决定使用angular2进行前后端分离开发,由我负责后端服务的开发,起初选择的是web api进行开发.对跨域访问通过API中间件+过滤器对跨域访问进行支持.开发一段后,通知需要移植 ...

  3. MVC跨域CORS扩展

    一般的基于浏览器跨域的主要解决方法有这么几种:1.JSONP       2.IFrame方式    3.通过flash实现  4.CORS跨域资源共享  ,这里我们主要关注的是在MVC里面的CORS ...

  4. 关于Spring MVC跨域

    1.Sping MVC 3.X跨域 关于跨域问题,主要用的比较多的是cros跨域. 详细介绍请看https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Ac ...

  5. spring mvc跨域设置(全局)

    //--------------第一步//spring 5版本全局配置方式 @Configuration @EnableWebMvc public class SpringMvcBeans imple ...

  6. spring mvc 跨域问题。。。解决

    官方推荐方式: http://spring.io/blog/2015/06/08/cors-support-in-spring-framework 方式1: $.ajax({ //前台:常规写法.注意 ...

  7. spring mvc 跨域请求处理——spring 4.2 以上

    Controller method CORS configuration You can add to your @RequestMapping annotated handler method a  ...

  8. Asp.Net 跨域,Asp.Net MVC 跨域,Session共享,CORS,Asp.Net CORS,Asp.Net MVC CORS,MVC CORS

    比如 http://www.test.com 和 http://m.test.com 一.简单粗暴的方法 Web.Config <system.web> <!--其他配置 省略……- ...

  9. 解决.Net Mvc跨域请求问题

    针对ASP.NET MVC和ASP.NET Web API两种项目类型 1.针对ASP.NET MVC,只需要在web.config中添加如下的内容即可 <system.webServer> ...

随机推荐

  1. Qt 拷贝内容到粘贴板 || 获取粘贴板内容

    QString source = ui->textEdit_code->toPlainText(); QClipboard *clipboard = QApplication::clipb ...

  2. z-tree学习笔记

    做项目时,需要用到带复选框的tree.经比较后优选了ztree,功能强大,文档清晰. http://www.treejs.cn/v3/api.php 直接上代码吧. 1.下载ztree后.将里面需要用 ...

  3. SqlServer父节点与子节点查询及递归

    在最近老是用到这个SQL,所以记下来了: 1:创建表 CREATE TABLE [dbo].[BD_Booklet]( [ObjID] [int] IDENTITY(1,1) NOT NULL, [P ...

  4. flask 定义数据库关系(一对一)

    一对一 我们将使用国家和首都来演示一对一关系:每个国家只有一个首都.反过来,一个城市也只能作为一个国家的首都.一对一关系如下: 在示例程序中,Country类表示国家,Capital类表示首都.建立一 ...

  5. 获取JS数组中所有重复元素

    //获取数组内所有重复元素,并以数组返回 //例:入参数组['1','2','4','7','1','2','2'] 返回数组:['1','2'] function GetRepeatFwxmmc(a ...

  6. python 装饰器(语法糖)

    def  login(func):    def testlogin():        for  i in range(3):            _username="abc" ...

  7. git 分支命名规范

    为规范开发,保持代码提交记录以及 git 分支结构清晰,方便后续维护,现规范 git 的相关操作. 主要规范两点: git 分支命名规范 git 提交记录规范 1. git 分支命名规范 git 分支 ...

  8. Python云图——WordCloud了解一下

    字符可以作画(参考前文:使用记事本画出照片) 字符串一样也可以 安装词云WordCloud. pip install wordcloud 编写要生成词云的内容字符串 保存为txt格式就可以了 使用Py ...

  9. 【Alpha】Scrum Meeting 3

    目录 简介: 工作内容: 工作修改: 燃尽图: 难点: 后期任务: 签入记录 团队讨论照片: 简介: 地点:J1-316 时间:4月3日星期四,晚上七点 会议目的:讨论大家此次的分工 工作内容: 陈治 ...

  10. Less、Sass和SCSS

    (一)区别: Less(可在客户端和服务端运行)是一种动态样式语言,对css赋予了动态语言的特性,如:变量.继承.运算.函数. SCSS为Sass的升级版本,兼容Sass功能,又新增功能.SCSS 需 ...