为了回顾，简单记录下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. html初始化

    建站老手都知道,这是为了考虑到浏览器的兼容问题,其实不同浏览器对有些标签的默认值是不同的,如果没对CSS初始化往往会出现浏览器之间的页面差异. 当然,初始化样式会对SEO有一定的影响,但鱼和熊掌不可兼 ...

  2. Proc-fs 编程

    一.简介 Proc文件系统是Linux系统上的一种伪文件系统(也即虚拟文件系统),存储的是当前内核运行状态的一系列特殊文件,用户可以通过这些文件查看有关系统硬件及当前正在运行进程的信息,甚至可以通过更 ...

  3. OpenGL 学习笔记 01 环境配置

    以下教程仅适用于Mac下的Xcode编程环境!其他的我也不会搞. 推荐教程:opengl-tutorial  本项目Github网址       OpenGL太可怕了...必需得把学的记下来,不然绝壁 ...

  4. 动手学习TCP：服务端状态变迁

    上一篇文章介绍了TCP状态机,并且通过实验了解了TCP客户端正常的状态变迁过程. 那么,本篇文章就一起看看TCP服务端的正常状态变迁过程 服务端状态变迁 根据上一篇文章中的TCP状态变迁图,可以得到服 ...

  5. [转]NPOI TestFunctionRegistry.cs

    本文转自:https://github.com/tonyqus/npoi/blob/master/testcases/main/SS/Formula/TestFunctionRegistry.cs   ...

  6. 【读书笔记《Android游戏编程之从零开始》】3.Android 游戏开发常用的系统控件（Button、Layout、ImageButton）

    3.1 Button Button这控件不用多说,就是一个按钮,主要是点击后进行相应事件的响应. 给组件添加ID属性:定义格式为 android:id="@+id/name",这里 ...

  7. UESTC 1227 & POJ 3667 Hotel

    非常细腻的线段树题目啊,后来还是有个细节写错了,查了一个晚上..就不分析了. 代码: #include <iostream> #include <cstdio> #includ ...

  8. 第2章 面向对象的设计原则（SOLID）：6_开闭原则

    6. 开闭原则(Open Closed Principle,OCP) 6.1 定义 (1)一个类应该对扩展开放,对修改关闭.要求通过扩展来实现变化,而且是在不修改己有的代码情况下进行扩展,也不必改动己 ...

  9. ios app架构设计系统文章

    三. iOS应用架构谈(三):网络层设计方案(上) http://www.infoq.com/cn/articles/ios-app-arch-3-1?utm_source=infoq&utm ...

  10. Spring Mvc 在非controller层 实现获取request对象

    一般我们在Controller层,会编写类似这样的方法 @Controller @RequestMapping(value="/detail") public class GetU ...