easyUI+springMVC的DataGrid-demo
DataGrid
(一)、搭建springMVC;
错误:无法访问HTML页面,HTTP Status 404-
原因:springMVC拦截了静态资源的访问
解决方案:方案①:(web.xml下)<servlet-mapping><servlet-name>jsp</servlet-name><url-pattern>*.html</url-pattern></servlet-mapping>
方案②:(springMVC.xml 下)<mvc:resources location="/" mapping="/**" />
(二)、加入easyUI:将解压后的easyui目录copy到WebContent目录下,并新建js目录、css目录
1、文件头:方式一:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<link rel="stylesheet" type="text/css" href="../easyui/themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="../easyui/themes/icon.css">
<link rel="stylesheet" type="text/css" href="../css/admin-index.css">
</head>
<body>
<table id="dg"></table>
<script type="text/javascript" src="../easyui/jquery.min.js"></script>
<script type="text/javascript" src="../easyui/jquery.easyui.min.js"></script>
<script type="text/javascript" src="../js/admin-index.js"></script>
<script type="text/javascript" src="../easyui/locale/easyui-lang-zh_CN.js"></script>
</body>
</html>
错误:确定路径没错,但界面一直显示不出来。
原因:springMVC拦截了静态资源的访问(PS:如果springMVC的配置不拦截则不会报错,比如:<url-pattern>/*.do</url-pattern>)
解决方案:
<!-- 静态资源访问 -->
<mvc:resources location="/jquery-easyui/themes/" mapping="/jquery-easyui/themes/**"/>
<mvc:resources location="/jquery-easyui/" mapping="/jquery-easyui/**"/>
<mvc:resources location="/jquery-easyui/locale/" mapping="/locale/**" />
2、js的admin-index.js:
/**
*
*/
$(function(){
$('#dg').datagrid({
url:'',
pagination:'ture',
columns:[[
{field:'id',title:'ID',width:100},
{field:'name',title:'用户名',width:100},
{field:'age',title:'年龄',width:100,align:'right'}
]]
});
})
easyUI+springMVC的DataGrid-demo的更多相关文章
- jQuery EasyUI教程之datagrid应用(三)
今天继续之前的整理,上篇整理了datagrid的数据显示及其分页功能 获取数据库数据显示在datagrid中:jQuery EasyUI教程之datagrid应用(一) datagrid实现分页功能: ...
- jQuery EasyUI教程之datagrid应用(二)
上次写到了让数据库数据在网页datagrid显示,我们只是单纯的实现了显示,仔细看的话显示的信息并没有达到我们理想的效果,这里我们丰富一下: 上次显示的结果是这样的 点击查看上篇:jQuery Eas ...
- jQuery EasyUI教程之datagrid应用(一)
最近一段时间都在做人事系统的项目,主要用到了EasyUI,数据库操作,然后抽点时间整理一下EasyUI的内容. 这里我们就以一个简洁的电话簿软件为基础,具体地说一下datagrid应用吧 datagr ...
- easyUI中点击datagrid列标题排序
easyUI中点击datagrid的排序有两种,一种是本地的,一种是服务器的.本地的只能排序当前页,而服务器的可以对全部页进行排序.这里主要是分享下服务器排序. 1.为datagrid添加属性remo ...
- easyUI 数据表格datagrid的使用
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...
- EasyUi控件Datagrid
很久没有打开我的博客园,刚刚大概扫了一眼我之前写的笔记,关于Devexpress那篇居然有四千多的浏览记录,不知道对浏览过的博友有没有起到一点点作用.当然我写笔记仅仅只是给自己留个记忆,如果歪打正着帮 ...
- EasyUI + ajax + treegrid/datagrid 接收 json 数据,显示树状/网状表结构
最后一更了,时间间隔有点久了~~ EasyUI作为一个成熟的前端框架,封装了ajax,对于数据的处理配合datagrid组件的使用,使其非常适合后台管理界面的开发(目前来说界面有点过时了). 通过aj ...
- easyui 之ComboTree 用法Demo
实现效果如下: HTML部分: <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="ser ...
- 基于SpringMVC框架项目Demo
Git地址:https://github.com/JavaWeb1024/SpringMVC 1. 框架简介: 为打造一套集群高可用的框架,集成的技术目前比较成熟,稳定.相关的知识点在网络上也 ...
随机推荐
- iOS 常用的向上,向下取整, 四舍五入函数
向上取整:ceil(x),返回不小于x的最小整数; 向下取整:floor(x),返回不大于x的最大整数; 四舍五入:round(x) 截尾取整函数:trunc(x)
- 2016huasacm暑假集训训练三 G - 还是畅通工程
题目链接:http://acm.hust.edu.cn/vjudge/contest/123674#problem/G 这题和上一道题差不多,还更简单点,直接用prim算法就行,直接贴AC代码: im ...
- Switch语句的case穿透
Switch语句的case穿透 一 switch语句几点说明: 1. case后面只能是常量,不能是变量,而且,多个case后面的值不能出现相同的. 2.case后面表达式可以接受: 基本数据类型,b ...
- Android课程---优化ListView列表视图(2)
layout_simple.xml <?xml version="1.0" encoding="utf-8"?> <LinearLayout ...
- linux一些基本命令
linux查看自己外网ip:curl ifconfig.me 删除目录:rm -rf 目录名 查看版本:rpm -q 版本 修改文件的用户权限:chown kds:kds agent.crontab修 ...
- easyui datagrid 编辑模式详解
一,建立编辑器 从api得知,扩展一种新的编辑器类型,需要提供以上几个方法.项目中正好需要一个checkbox 类型编辑器,但在easyui中并没提供这样的编辑器,那我们可以通过扩展编辑器来解决 ...
- 动态SQL语句之sp_executesql的使用
sp_executesql,sql2005中引入的新的系统存储过程,也是用来处理动态sql的, 如: exec sp_executesql @sql, N'@item_name nvarchar(10 ...
- Java语言程序设计(基础篇) 第四章 数学函数、字符和字符串
第四章 数学函数.字符和字符串 4.2 常用数学函数 方法分三类:三角函数方法(trigonometric method).指数函数方法(exponent method)和服务方法(service m ...
- 【转载】LR提交JSON格式的请求
需求: 测试一个“修改用户铜板”的接口,这个接口接收JSON格式的请求,返回JSON格式的结果: 必须用PUT方式提交请求: 提交内容: {"method":"modi ...
- installing mysql,this may take a few minutes,hold on plz wdcp卡住解决办法
centos6安装wdcp时make in progress卡住的解决办法 今天在一台centos6的vps上安装wdcp出现的这个问题,到安装程序滚动至下面这里时出现"卡死". ...