struts+hibernate+oracle+easyui实现lazyout组件的简单案例——Jsp页面

简介: struts+hibernate+oracle+easyui实现lazyout组件的简单案例——Jsp页面

由于要导入好多js文件和cs文件,并且每个页面都需要导入,所以我把公共的导入js和css文件放在了一个jsp里面,在用到的里面直接导入即可,

此项目用到的js文件下载:这里

用到的css文件的下载:这里

公共的导入外部js和css的jsp(commTop.jsp)

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<link rel="stylesheet" type="text/css" href="<%=path %>/easyui/css/demo.css">
  <link rel="stylesheet" type="text/css" href="<%=path %>/easyui/themes/black/easyui.css">
  <link rel="stylesheet" type="text/css" href="<%=path %>/easyui/themes/icon.css">
  <script type="text/javascript" src="<%=path %>/js/jquery-1.8.0.min.js"></script>
  <script type="text/javascript" src="<%=path %>/js/jquery.easyui.min.js"></script>
  <script type="text/javascript" src="<%=path %>/js/easyui-lang-zh_CN.js"></script>


接下来进入首页index.jsp:

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@include file="commTop.jsp"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>首页</title>
  <meta http-equiv="pragma" content="no-cache">
  <meta http-equiv="cache-control" content="no-cache">
  <meta http-equiv="expires" content="0">    
  <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
  <meta http-equiv="description" content="This is my page">
  <style type="text/css">
    #top{
      width:30%;
      line-height:60px;
      margin:0px auto;
      
      }
  </style>
  <script type="text/javascript">
    $(function(){
      $("#btn1").click(function(){
        var ename=$("#empName").val();
        var deptno=$("#deptno").val();
        $("#dg").datagrid(
          "reload",
          {"cond.empName":ename,"cond.dept.deptno":deptno}
          );
      });
    
      /* 树形菜单 */
      $("#tree").tree({
        url:'grtallDept.action',
        animate:true,
        onClick:function(node){
          if(node.id!=0){
            //alert(node.id);
            //将部门名称保存到隐藏域中
            $("#deptno").val();   //当前的id
            $("#dg").datagrid({
              url:'getEmp.action',
              queryParams: {
                "cond.dept.deptno": node.id
              },
              pagination:true,
              pageSize:2,
              pageList:[2,4,6,8],
              columns:[[   
                    {field:'empno',title:'编号',width:100},   
                    {field:'ename',title:'姓名',width:100},   
                    {field:'job',title:'职位',width:100,align:'right'}   
                ]]
            });
          };
        }, 
        onDblClick:function(node){
          $(this).tree("toggle",node.target);
        }
      });
    });
  </script>
  </head>
  
<body class="easyui-layout">  
    <div data-options="region:'north',title:'头部',split:true" style="height:100px;">
      <div id="top">
        <h2>员工信息查询系统</h2>
      </div>
    </div>  
    <div data-options="region:'south',title:'尾部',split:true" style="height:100px;"></div>  
    <div data-options="region:'east',iconCls:'icon-reload',title:'右边',split:true" style="width:100px;"></div>  
    <div data-options="region:'west',title:'部门信息',split:true" style="width:200px;">
      <!-- 树形菜单 -->
      <ul id="tree"></ul>  
      
    </div>  
    <div data-options="region:'center',title:'员工信息'" style="padding:5px;background:#eee;">
      <!-- datagrid -->
      <span style="color:black">员工姓名:</span><input type="text" id="empName"/>
      <input type="hidden" id="deptno"/>
      <input type="button" value="查询" id="btn1"/>
      <table id="dg"></table>  
      
    </div>  
</body> 
</html>


目录
相关文章
|
8天前
ssm使用全注解实现增删改查案例——showEmp.jsp
ssm使用全注解实现增删改查案例——showEmp.jsp
12 0
|
8天前
ssm使用全注解实现增删改查案例——showDept.jsp
ssm使用全注解实现增删改查案例——showDept.jsp
15 0
|
8天前
ssm使用全注解实现增删改查案例——updateEmp.jsp
ssm使用全注解实现增删改查案例——updateDept.jsp
9 0
|
8天前
ssm使用全注解实现增删改查案例——saveEmp.jsp
ssm使用全注解实现增删改查案例——saveEmp.jsp
11 0
|
8天前
|
Java
struts+hibernate+oracle+easyui实现lazyout组件的简单案例——Action的实现类
struts+hibernate+oracle+easyui实现lazyout组件的简单案例——Action的实现类
12 0
|
8天前
使用ueditor实现多图片上传案例——前台数据层(Index.jsp)
使用ueditor实现多图片上传案例——前台数据层(Index.jsp)
18 0