1)建立一个实体类

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web; namespace MvcApplication23.Models
{
public class UserInfo
{
public int Id { get; set; } public string Name { get; set; } public int Age { get; set; }
}
}

实体类

2)建立API控制器

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using MvcApplication23.Models;
using System.Web.Http; namespace MvcApplication23.Controllers
{
public class HomeController :ApiController
{
//
// GET: /Home/ public List<UserInfo> GetUser()
{
var userList = new List<UserInfo>{
new UserInfo{ Id=, Name="lidu1", Age=},
new UserInfo{ Id=, Name="lidu2", Age=},
new UserInfo{ Id=, Name="lidu3", Age=}
};
var temp = (from u in userList select u).ToList();
return temp;
} }
}

API控制器

这时候 可以在地址栏中输入url 可以看见效果了 :http://localhost:42571/api/Home/GetUser

3)测试客户端 效果 或者展示

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<script src="Scripts/jquery-1.8.2.js"></script>
<script>
$(function () {
$.ajax({
type: "Get",
dataType: "json",
contentType: "application/json;charset=utf-8",
url: "/api/Home/GetUser",
success: function (data) {
var tbody = $("#tbody1");
$.each(data, function (idx, item) {
OutputData(tbody, item);
});
}
});
function OutputData(tbody, item) {
tbody.append(
"<tr>" +
"<td style=\"border:1px solid #0094ff;\">" +
item.Id +
"</td>" +
"<td style=\"border:1px solid #0094ff;\">" + item.Name +
"</td>" +
"<td style=\"border:1px solid #0094ff;\">" + item.Age +
"</td>" + "</tr>");
}
}); </script>
</head>
<body>
<table>
<thead>
<tr>
<td style="border:1px solid #0094ff">Id</td>
<td style="border:1px solid #0094ff">Name</td>
<td style="border:1px solid #0094ff">Age</td> </tr>
</thead>
<tbody id="tbody1"> </tbody>
</table>
</body>
</html>

界面代码通过Ajax 获取API的值然后展示

最后效果如下:

mvcAPI (入门 2)的更多相关文章

  1. mvcAPI (入门 3)(源码)

    mvcAPI (入门 3)(源码) http://download.csdn.net/detail/chunfang740/9078579

  2. mvcAPI (入门 3)

    续上 1)无参数Get请求 <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> < ...

  3. mvcAPI (入门 1)

    步骤: 1)建立order 类 2)建立OrderEntity类 3)创建控制器API 这时候能看到Json 格式的数据啦 5)想在网页或客户端显示 添加一个网页 如下: <!DOCTYPE h ...

  4. Angular2入门系列教程7-HTTP(一)-使用Angular2自带的http进行网络请求

    上一篇:Angular2入门系列教程6-路由(二)-使用多层级路由并在在路由中传递复杂参数 感觉这篇不是很好写,因为涉及到网络请求,如果采用真实的网络请求,这个例子大家拿到手估计还要自己写一个web ...

  5. ABP入门系列(1)——学习Abp框架之实操演练

    作为.Net工地搬砖长工一名,一直致力于挖坑(Bug)填坑(Debug),但技术却不见长进.也曾热情于新技术的学习,憧憬过成为技术大拿.从前端到后端,从bootstrap到javascript,从py ...

  6. Oracle分析函数入门

    一.Oracle分析函数入门 分析函数是什么?分析函数是Oracle专门用于解决复杂报表统计需求的功能强大的函数,它可以在数据中进行分组然后计算基于组的某种统计值,并且每一组的每一行都可以返回一个统计 ...

  7. Angular2入门系列教程6-路由(二)-使用多层级路由并在在路由中传递复杂参数

    上一篇:Angular2入门系列教程5-路由(一)-使用简单的路由并在在路由中传递参数 之前介绍了简单的路由以及传参,这篇文章我们将要学习复杂一些的路由以及传递其他附加参数.一个好的路由系统可以使我们 ...

  8. Angular2入门系列教程5-路由(一)-使用简单的路由并在在路由中传递参数

    上一篇:Angular2入门系列教程-服务 上一篇文章我们将Angular2的数据服务分离出来,学习了Angular2的依赖注入,这篇文章我们将要学习Angualr2的路由 为了编写样式方便,我们这篇 ...

  9. Angular2入门系列教程4-服务

    上一篇文章 Angular2入门系列教程-多个组件,主从关系 在编程中,我们通常会将数据提供单独分离出来,以免在编写程序的过程中反复复制粘贴数据请求的代码 Angular2中提供了依赖注入的概念,使得 ...

随机推荐

  1. linux第9天 UDP

    今天学了一点UDP知识,还是IP协议.都不是重点,重点是socket服务器框架 不过还是把今天学的东西,先罗列出来,将来复习的时候方便 q  UDP报文可能会丢失.重复 q  UDP报文可能会乱序 q ...

  2. HDU 3037 Saving Beans(Lucas定理模板题)

    Problem Description Although winter is far away, squirrels have to work day and night to save beans. ...

  3. Mysql索引总结(二)

    在数据库表中,对字段建立索引可以大大提高查询速度.假如我们创建了一个 mytable表: ) NOT NULL ); 在查找username="admin"的记录 SELECT * ...

  4. PAT乙级 1026. 程序运行时间(15)

    1026. 程序运行时间(15) 时间限制 200 ms 内存限制 65536 kB 代码长度限制 8000 B 判题程序 Standard 作者 CHEN, Yue 要获得一个C语言程序的运行时间, ...

  5. java 网络编程(二)----UDP基础级的示例

    下面介绍UDP基础级的代码示例: 首先了解创建UDP传输的发送端的思路: 1.创建UDP的Socket服务.2.将要发送的数据封装到数据包中.3.通过UDP的socket服务将数据包发送出去.4.关闭 ...

  6. x3270: PCOM的替代品

    在Linux上登录Mainframe的利器,而且也是PCOM的免费版.原来没有仔细研究,今天花了一些时间学习,确实能满足基本的要求: x3270的Homepage  看一下Release Note, ...

  7. hadoop自带例子wordcount的具体运行步骤

    1.在hadoop所在目录“usr/local”下创建一个文件夹input root@ubuntu:/usr/local# mkdir input 2.在文件夹input中创建两个文本文件file1. ...

  8. Terminal的快捷键 for Terminal for Mac OS 10.10, Linux/GNU(Ubuntu, deepin, elementory os,CentOS)

    对于习惯用windows键盘的,突然转成Mac蓝牙键盘真的有点不习惯,尤其是多了⌘这个键,还有Alt键也成了Option 但是对于Windows下熟悉的快捷键,它们真的失效了,还好Ubuntu也常用, ...

  9. 【JQGRID DOCUMENTATION】.学习笔记.2.基本表格

    JqGrid的实例是一个JavaScript对象,带有属性,事件和方法.属性可以是字符串,数字,数组,布尔值或任何其他对象. 1 调用的约定: $("#grid_id").jqGr ...

  10. mina

    http://bsr1983.iteye.com/blog/1886296 http://blog.csdn.net/defonds/article/category/1844073(这个网站原创最全 ...