为了回顾,简单记录下EasyUI如何使用:

先来张效果图:

这张图是从后台获取数据,然后进行展示的。

我这里利用的是EF-MVC.

先说下View视图里面的HTML代码是如何写的:

@{
ViewBag.Title = "Index";
Layout = "~/Views/Shared/_Layout.cshtml";
}
<script type="text/javascript">
$(function () {
var editRow = undefined;
$("#tb1").datagrid({
title: "用户列表",
width: 700,
height: 300,
loadMsg: '正在加载用户信息...',
singleSelect: false,
fitColumns: true,
striped: true,
url: "/RYJ/Index1",
singleSelect: true,
pagination: true,
rownumbers: true,
pageSize: 5,
pageList: [5, 10, 15],
columns: [
[
{ title: "编号", field: "id", allgn: "center", width: 80 },
{ title: "姓名", field: "stuName", allgn: "center", width: 80 },
{ title: "年龄", field: "stuAge", allgn: "center", width: 80 },
{ title: "性别", field: "stuSex", allgn: "center", width: 80 },
]
],
//在数据加载成功的时候触发。
})
})
</script> @Html.ActionLink("添加","Create","RYJ")
<table id="tb1"></table>
 

前后台根据 field后面的信息来匹配,比如前台field: "id",后台传值的要定义id属性。public int id{get;set;} 然后赋值id=1 然后弄成json格式传递给前台。

再说下Controller控制器是如何传值的:

   public ActionResult Index1()
{
return View();
}
[HttpPost]
public ActionResult Index1(Stu s)
{
int pageIndex=string.IsNullOrEmpty(Request["page"])?1:int.Parse(Request["page"]);
int pageSize=Request["rows"]==null?5:int.Parse(Request["rows"]);
int total = context.Set<Stu>().Count();
var rows = context.Set<Stu>()
.OrderBy(c => c.id)
.Skip((pageIndex - 1) * pageSize)
.Take(pageSize);
//这里必须返回的是total和rows
return Json(new { total,rows},JsonRequestBehavior.AllowGet);
}

在使用时是需要添加引用的,但是我们看到我上面并没添加,因为我把它定义成了全局引用。看下图

代码如下:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width" />
<title>@ViewBag.Title</title>
<link href="~/Content/easyUI/themes/bootstrap/easyui.css" rel="stylesheet" />
<link href="~/Content/easyUI/icon.css" rel="stylesheet" />
<script src="~/Scripts/jquery.min.js"></script>
<script src="~/Content/easyUI/jquery.easyui.min.js"></script>
</head>
<body>
@RenderBody()
</body>
</html>

  

Jquery-EasyUI学习~的更多相关文章

  1. jQuery EasyUI学习资源汇总

    jQuery EasyUI学习资源汇总 EasyUi – 1.入门 EasyUi – 2.布局Layout + 3.登录界面 EasyUi – 4.datwagrid 学习Jquery EasyUI的 ...

  2. JQuery EasyUI学习框架

    前言 前端技术,新项目的开发拟使用EasyUI框架(基于EasyUI丰富UI组件库),项目负责人的提示EasyUI分配给我这个任务.发展前,我需要这对于一个新手EasyUI框架学习一些基本的入门.记录 ...

  3. jQuery EasyUI学习二

    1.   课程介绍 1.  Datagrid组件(掌握) 2.  Dialog.form组件(掌握) 3. Layout.Tabs;(掌握) Datagrid组件 2.1.  部署运行pss启动无错 ...

  4. JQuery EasyUI学习笔记

    转载请注明原文地址:http://www.cnblogs.com/ygj0930/p/6690888.html  简介与准备 jQuery EasyUI 是一个基于 jQuery 的框架,集成了各种用 ...

  5. JQuery EasyUI学习记录(三)

    1.jQuery EasyUI messager使用方式 1.1 alert方法 $(function(){ //1.alert方法---提示框 $.messager.alert("标题&q ...

  6. JQuery EasyUI学习记录(二)

    1.jquery easyUI动态添加选项卡(查看jquery easyUI手册) 1.1 用于动态添加一个选项卡 1.1.1 选中指定的选项卡和判断某个选项卡是否存在 测试代码: <a id= ...

  7. JQuery EasyUI学习记录(一)

    1.主页设计(JQuery EasyUI插件) 下载easyUI开发包: 将easyUI资源文件导入页面中: <link rel="stylesheet" type=&quo ...

  8. jQuery EasyUI学习一

    1.   jQuery EasyUI介绍 1.  创建组件的方式和原理(掌握) 2.  组件三要素(掌握) 3.  Panel.LinkButton.上下文菜单;(掌握) 简介 2.1.  jQuer ...

  9. JQuery EasyUI学习记录(五)

    1.datagrid使用方法(重要) 1.1将静态html渲染为datagrid样式 <!--方式一: 将静态html渲染为datagrid样式 --> <table class=& ...

  10. JQuery EasyUI学习记录(四)

    1.EasyUI中的validatebox使用 提供的校验规则: 1.非空校验required="required" 2.使用validType指定 email: 正则表达式匹配电 ...

随机推荐

  1. Design Tip #142 Building Bridges

    http://www.kimballgroup.com/2012/02/design-tip-142-building-bridges/ The dominant topologies of Data ...

  2. 给定一个整数N,找出一个比N大且最接近N,但二进制权值与该整数相同 的数

    1,问题描述 给定一个整数N,该整数的二进制权值定义如下:将该整数N转化成二进制表示法,其中 1 的个数即为它的二进制权值. 比如:十进制数1717 的二进制表示为:0000 0110 1011 01 ...

  3. POJ 2186 Popular Cows --强连通分量

    题意:给定一个有向图,问有多少个点由任意顶点出发都能达到. 分析:首先,在一个有向无环图中,能被所有点达到点,出度一定是0. 先求出所有的强连通分支,然后把每个强连通分支收缩成一个点,重新建图,这样, ...

  4. Android签名机制:生成keystore、签名、查看签名信息

    转自:http://www.ourunix.org/post/146.html

  5. rsync+inotify实时同步环境部署记录

    随着应用系统规模的不断扩大,对数据的安全性和可靠性也提出的更好的要求,rsync在高端业务系统中也逐渐暴露出了很多不足.首先,rsync在同步数据时,需要扫描所有文件后进行比对,进行差量传输.如果文件 ...

  6. 介绍linux下利用编译bash设置root账号共用的权限审计设置

    在日常运维工作中,公司不同人员(一般是运维人员)共用root账号登录linux服务器进行维护管理,在不健全的账户权限审计制度下,一旦出现问题,就很难找出源头,甚是麻烦!在此,介绍下利用编译bash使不 ...

  7. 矩形覆盖-我们可以用2*1的小矩形横着或者竖着去覆盖更大的矩形。请问用n个2*1的小矩形无重叠地覆盖一个2*n的大矩形,总共有多少种方法?

    class Solution { public: int rectCover(int number) { ; ; ; ||number==) ; ) ; ;i<number+;i++){ res ...

  8. 集锦.txt

    不同的时代,有不同的需要以前,我们都以为自己可以为爱情去死,可是后来爱情死了,我们还活着. 小时候男孩子喜欢电动玩具,女孩子喜欢娃娃.长大了男孩子喜欢娃娃,女孩子喜欢电动玩具.也许这就是成长吧! 我大 ...

  9. iBatis.net入门指南

    iBatis.net入门指南    - 1 - 什么是iBatis.net ?    - 3 - iBatis.net的原理    - 3 - 新人指路    - 3 - iBatis.net的优缺点 ...

  10. Memcached通用类(基于enyim.com Memcached Client)

    一.如果用官方提供的方法,在web.config里面配置好了各个参数和服务器IP.如下图: <?xml version="1.0"?> <configuratio ...