010 资源目录整理

最新推荐文章于 2025-06-01 14:00:00 发布

原创最新推荐文章于 2025-06-01 14:00:00 发布 · 2k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#springmvc #资源目录

java-web 专栏收录该内容

13 篇文章

订阅专栏

010 资源目录整理

视频发布在youtube上面了
https://youtu.be/NcO_PRf94xY
优酷上面的链接
http://v.youku.com/v_show/id_XMjgzOTkwNzUxMg==.html?f=49760672

资源目录结构做了一下调整：

目录路径	说明
webapp/resources/commons/js	自定义通用脚本
webapp/resources/commons/jsExt	外部引用脚本
webapp/resources/themeDefault/css	默认主题css配置
webapp/resources/themeDefault/images	默认主题图片配置
webapp/resources/themeDefault/js	默认主题脚本配置

在TestUser里面加入@WebAppConfiguration注解，用于加载WebApplicationContext,名字改为TestUserService，因为这个是用来测试service接口的。

@RunWith(SpringJUnit4ClassRunner.class)
@ContextConfiguration(locations = "classpath:springmvc.xml")
@WebAppConfiguration
public class TestUser
{
...

springmvc.xml需要添加一个配置，处理静态资源的

<mvc:annotation-driven conversion-service="conversionService">
...
</mvc:annotation-driven>
<!-- 由Spring MVC框架自己处理静态资源，并添加一些有用的附加值功能 -->
<mvc:resources mapping="/resources/**" location="/resources/commons/,/resources/themeDefault/"
    order="0" cache-period="31556926">
    <mvc:cache-control max-age="3600" cache-public="true" />
</mvc:resources>

上面的设置请求/resources/**时Spring会映射到/resources/themeDefault/
当需要更新主题样式的时候更新一下即可

<mvc:resources mapping="/resources/**" location="/resources/theme-new/" />

修改user.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<!-- 下面两个必须引用 -->
<script type="text/javascript"
    src="resources/jsExt/jquery-easyui-1.5.2/jquery.min.js"></script>
<script type="text/javascript"
    src="resources//jsExt/jquery-easyui-1.5.2/jquery.easyui.min.js"></script>
<!-- 国际化文件 -->
<script type="text/javascript"
    src="resources//jsExt/jquery-easyui-1.5.2/locale/easyui-lang-zh_CN.js"></script>
<!-- 默认样式 -->
<link rel="stylesheet"
    href="resources/jsExt/jquery-easyui-1.5.2/themes/default/easyui.css">
<!-- 图标 -->
<link rel="stylesheet"
    href="resources/jsExt/jquery-easyui-1.5.2/themes/icon.css">
<!-- 自定义js -->
<script type="text/javascript" src="resources/js/teacherFormatter.js"></script>
<!-- 自定义的js脚本 -->
<script type="text/javascript" src="resources/js/commons.js"></script>
<script type="text/javascript" src="resources/js/user/userOper.js"></script>
<link rel="stylesheet" href="resources/css/user.css">

</head>
<body>
    <div id="tt" class="easyui-layout" style="margin: 20px 20px 20px 20px;">
        <table id="dg" class="easyui-datagrid" title="用户列表"
            style="width: 100%; height: 400px;pagination-num{width:200px}"
            data-options="rownumbers:true,striped:true,fitColumns:true,singleSelect:true,autoRowHeight:true,pagination:true,
                pageSize:12,pageList:[12,100,200,300],url:'${pageContext.request.contextPath}/getUsers',method:'get',toolbar:'#toolbar'">
            <thead>
                <tr>
                    <th data-options="field:'id',width:100">ID</th>
                    <th data-options="field:'name',width:100">name</th>
                    <th data-options="field:'age',width:100">Age</th>
                    <th data-options="field:'gender',width:60">Gender</th>
                    <th data-options="field:'email',width:150">Email</th>
                    <th data-options="field:'createTime',width:150">Create Time</th>
                    <th data-options="field:'loginTime',width:150">Login Time</th>
                    <th data-options="field:'teacher',width:100"
                        formatter="teacherFormatter">Teacher Name</th>
                </tr>
            </thead>
        </table>
        <div id="toolbar">
            <a href="#" class="easyui-linkbutton"
                data-options="iconCls:'icon-add'" onclick="insert()">添加</a> <a
                href="#" class="easyui-linkbutton"
                data-options="iconCls:'icon-edit'" onclick="edit()">编辑</a> <a
                href="#" class="easyui-linkbutton"
                data-options="iconCls:'icon-remove'" onclick="del()">删除</a>
        </div>
    </div>

    <!-- create user dialog -->
    <div id="dlg" class="easyui-dialog"
        data-options="iconCls:'icon-save',resizable:true,modal:true"
        style="width: 400px; height: 280px; padding: 10px 20px" closed="true"
        buttons="#dlg-buttons">
        <div class="ftitle">用户信息</div>
        <form id="fm" method="post">
            <div class="fitem">
                <label for="name">用户名:</label> <input name="name"
                    class="easyui-validatebox" type="text" data-options="required:true">
            </div>
            <div class="fitem">
                <label for="age">年 龄:</label> <input name="age"
                    class="easyui-numberbox" type="text"
                    data-options="required:true,validType:'number'">
            </div>
            <div class="fitem">
                <label for="gender">性 别:</label> <input id="state1" name="gender"
                    value="男" type="radio" checked="true" />男 <input id="state2"
                    name="gender" value="女" type="radio" />女
            </div>
            <div class="fitem">
                <label for="email">Email:</label> <input name="email"
                    class="easyui-validatebox" type="text"
                    data-options="required:true,validType:'email'">
            </div>
            <div class="fitem">
                <label for="teacherId">教 师:</label> <input id="cc"
                    class="easyui-combobox" name="teacherId"
                    data-options="valueField:'id',textField:'name',panelHeight:80,editable:false,method:'get',url:'${pageContext.request.contextPath}/getTeacherComboData'">
            </div>
        </form>
    </div>
    <div id="dlg-buttons">
        <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-ok'"
            onclick="save()">Save</a> <a href="#" class="easyui-linkbutton"
            data-options="iconCls:'icon-cancel'"
            onclick="javascript:$('#dlg').dialog('close')">Cancel</a>
    </div>
</body>
</html>

修改一下userOper.js

/*!
 * imalex@163.com - v0.1 (2015-08-29 18:00:00 +0800)
 * Copyright 2015
 */
$(function() {

});

$('#dg').pagination({
    pageSize: 20,//每页显示的记录条数，默认为10 
    pageList: [20, 50, 100],//可以设置每页记录条数的列表 
});

function insert() {
    $('#dlg').dialog('open').dialog('setTitle', '新建用户');
    $('#fm').form('clear');
    url = ctx + '/users';
    type = insert;
}

function edit() {
    var row = $('#dg').datagrid('getSelected');
    if (row) {
        $('#dlg').dialog('open').dialog('setTitle', '编辑用户信息');
        $('#fm').form('load', row);
        //setCheckedValue(document.forms['fm'].elements['gender'], row['gender']);
        url = ctx + '/users/' + row.id;
        type = edit;
    }
}

function save() {
    $('#fm').form('submit', {
        url : url,
        type:type,
        onSubmit : function(param) {
            if (type == edit) {
                //use put 
                param._method ='PUT';
            }
            param.createTime = new Date().Format("yyyy-MM-dd hh:mm:ss");
            param.loginTime = param.createTime;

            var ret = $(this).form('validate');
            return ret;
        },
        success : function(result) {
            var result = eval('(' + result + ')');
            if (result.errorMsg) {
                $.messager.show({
                    title : 'Error',
                    msg : result.errorMsg
                });
            } else {
                $('#dlg').dialog('close'); // close the dialog
                $('#dg').datagrid('reload'); // reload the user data
            }
        }
    });
}

function del() {
    var row = $('#dg').datagrid('getSelected');
    if (row) {
        $.messager.confirm('确认', '请确认删除已选择用户?', function(r) {
            if (r) {
                $.post(ctx + '/users/' + row.id, {
                    _method : 'DELETE'
                }, function(result) {
                    if (result.status != null) {
                        $('#dg').datagrid('reload'); // reload the user data
                    } else {
                        $.messager.show({ // show error message
                            title : 'Error',
                            msg : result.errorMsg
                        });
                    }
                }, 'json');
            }
        });
    }
}