SSI(动态2级联动)

1:建数据表

-- Create table
create table TB_SYS_AREAINFO
(
  AREAID     VARCHAR2(20) not null,
  AREANAME   VARCHAR2(20),
  PARENTID   NUMBER(5),
  ISSELECTED NUMBER(1),
  REMARK     VARCHAR2(100),
  COLUMN1    VARCHAR2(255),
  COLUMN2    VARCHAR2(255),
  COLUMN3    VARCHAR2(255),
  COLUMN4    VARCHAR2(255),
  COLUMN5    VARCHAR2(255)
)
tablespace TSAMPSYSTEM
  pctfree 10
  initrans 1
  maxtrans 255
  storage
  (
    initial 64K
    next 1M
    minextents 1
    maxextents unlimited
  );
-- Add comments to the columns
comment on column TB_SYS_AREAINFO.AREAID
  is '地区ID(唯一标识)';
comment on column TB_SYS_AREAINFO.AREANAME
  is '地区名称';
comment on column TB_SYS_AREAINFO.PARENTID
  is '上级地区ID(默认值为0)';
comment on column TB_SYS_AREAINFO.ISSELECTED
  is '区域是否选中(0:未选中1:已选中2:已有用户或有设备)';
comment on column TB_SYS_AREAINFO.REMARK
  is '备注';
comment on column TB_SYS_AREAINFO.COLUMN1
  is '扩展字段1';
comment on column TB_SYS_AREAINFO.COLUMN2
  is '扩展字段2';
comment on column TB_SYS_AREAINFO.COLUMN3
  is '扩展字段3';
comment on column TB_SYS_AREAINFO.COLUMN4
  is '扩展字段4';
comment on column TB_SYS_AREAINFO.COLUMN5
  is '扩展字段5';
-- Create/Recreate primary, unique and foreign key constraints
alter table TB_SYS_AREAINFO
  add primary key (AREAID)
  using index
  tablespace TSAMPSYSTEM
  pctfree 10
  initrans 2
  maxtrans 255
  storage
  (
    initial 64K
    next 1M
    minextents 1
    maxextents unlimited
  );

需要有一点注意的就是,比如定义了一个长沙,id=123, 在定义一个湖南 id=23,那么长沙的parentid就是23,。

 

2:   新建一个页面  noacces.JSP

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
 String path = request.getContextPath();
 String basePath = request.getScheme() + "://"
   + request.getServerName() + ":" + request.getServerPort()
   + path + "/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
 <head>
  <base href="<%=basePath%>">

  <title>My JSP 'noacces.jsp' starting page</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">
  <!--
 <link rel="stylesheet" type="text/css" href="styles.css">
 -->
   <script type="text/javascript"
   src="<%=request.getContextPath()%>/jqueryui/js/jquery-1.8.2.js"></script>
  <script type="text/javascript" src="<%=request.getContextPath()%>/resources/sytle/common/js/plLink.js"></script>                     //导入自己编写的js,也就是自定义js组件
     <script type="text/javascript">   
       $(document).ready(function(){
           initCity('selectc');                                            //jquery 初始化加载 ,   selectc为你省份下拉框id
       }) 
     </script>

 
 </head>

 <body>


  <form name=form1>
   <table width=300 border=0 cellspacing="0" cellpadding="1"
    bgcolor=#FFFDE6>
    <tr>
     <td class="black_con9" align="right">
      省份
     </td>
     <td class="black_con9">
      <select name="selectc" id="selectc" οnchange="selectcOnChange('selectc','selecta')">              //通过onchange事件,为2级菜单加载数据,传递省和市的下拉框ID
       <option value="1" selected>
        请选择
       </option>
      </select>
     </td>
    </tr>
    <tr>
     <td class="black_con9" align="right">
      城市
     </td>
     <td class="black_con9">
      <select name="selecta" id="selecta">
       <option value="1" selected>
        请选择
       </option>
      </select>
     </td>
    </tr>
   </table>
  </form>
 </body>
</html>

 

3:自定义js组件。名称为pllink.js

  function initCity(selectc) {
     $.ajax({
        type : "post",
        url : "getCityInfo.action",
        cache : false,
        dataType: "json",
        data : {},
        contentType: "application/x-www-form-urlencoded;charset=UTF-8",
        async: false,
        success : function(data){
         for(var i=0;i<data.ctInfo.length;i++){
              document.getElementById(selectc).options.add(new Option(data.ctInfo[i].areaName,data.ctInfo[i].areaId));
         }
        },
        error : function(data) {
         alert('city leave data error' );
        }
       });
     };
  
    
    
     function selectcOnChange(selectc,selecta){
      
                               var obj = document.getElementById(selectc);
                var index = obj.selectedIndex;
                var text = obj.options[index].text;
                               var value = obj.options[index].value; 
                      $.ajax({        
        type : "post",
        url : "queryAreaInfo.action",
        cache : false,
        dataType: "json",
        data : {"cid":value},
        contentType: "application/x-www-form-urlencoded;charset=UTF-8",
        async: false,
        success : function(data){
        document.getElementById(selecta).options.length=1;
         for(var i=0;i<data.areaInfo.length;i++){
              document.getElementById(selecta).options.add(new Option(data.areaInfo[i].areaName,data.areaInfo[i].areaId));
         }
        },
        error : function(data) {
         alert('area leave data error' );
        }
       });
     }

 4:struts.xml配置

<package name="cityAndAreaLink" extends="json-default">
     <!-- 根据省ID 查询市级相关数据 -->
  <action name="getCityInfo" class="cityAreaLinkAction"
   method="getCityInfo">
   <result type="json"></result>
  </action>
 
  <!-- 根据市ID 查询区域级相关数据 -->
  <action name="queryAreaInfo" class="cityAreaLinkAction"
   method="queryAreaInfo">
   <result type="json"></result>
  </action>   
 
 </package>

 

 <!-- 2级联动 -->           
 <bean name="cityAreaLinkAction"
  class="com.onecom.amp.system.common.web.action.CityAreaLinkAction">
  <property name="calService" ref="cityAreaLinkServer"></property>
 </bean>

    <!-- 2级联动 -->
 <bean name="cityAreaLinkServer"
  class="com.onecom.amp.system.common.service.impl.CityAreaLinkServiceImpl">
  <property name="calDao" ref="cityAreaLinkDao"></property>
 </bean>

 

5。1:java后台代码编写CityAreaLinkAction。java

package com.onecom.amp.system.common.web.action;

import java.util.List;

import net.sf.json.JSONSerializer;

import org.apache.commons.logging.Log;

import com.onecom.amp.analysis.dao.impl.TbAanalysisCityTGsmTempInfoDaoImpl;
import com.onecom.amp.system.common.domain.TbSysAreaInfo;
import com.onecom.amp.system.common.service.CityAreaLinkService;
import com.onecom.onecomframework.utils.logger.OneComPlatformLogger;
import com.onecom.onecomframework.web.action.OneComPlatformBaseAction;

/*
 *
 * 城市 --地区  2级联动相关action
 * @author    tangx
 * @version   V100 Jul 23, 2013
 * @see       [相关类/方法]
 * @since     ONECOMTECH.COM V100R001C00
 *
 */

public class CityAreaLinkAction extends OneComPlatformBaseAction {

    /**
     * 属性serialVersionUID
     */
    private static final long serialVersionUID = 2639952175888708226L;

    /** 实例化日志记录器对象 */
    private static final OneComPlatformLogger logger = new OneComPlatformLogger(
     TbAanalysisCityTGsmTempInfoDaoImpl.class);

    /** 实例化分模块记录对象 */
    private static final Log log = logger.getLog("systemLog");

    // 市级id
    private String cid;

    // 市级信息
    private List<TbSysAreaInfo> ctInfo;

    // 县级信息
    private List<TbSysAreaInfo> areaInfo;

    private CityAreaLinkService calService;

    /**
     *
     * 获取一级菜单信息,一级菜单属于城市,包括城市的areaId 和 areaName
     *
     * @return String 如果有违例,请使用@exception/throws [违例类型]
     *         [违例说明:异常的注释必须说明该异常的含义及什么条件下抛出该
     * @see [类、类#方法、类#成员]
     */
    public String getCityInfo() {
 log.debug("二级联动:CityAreaLinkAction.getCityInfo bean");
 // 拿到角色ID,根据角色ID判断是省级用户 还是市级用户
 String roleId = (String) super.getSession().getAttribute("roleId");
 // 拿到角色区域ID,根据角色区域ID去查询上下级相关区域信息
 String pid = (String) super.getSession().getAttribute("userAreaId");
 if (roleId != null) {
     // 判断是否省级用户
     if ("0".equals(roleId) || "1".equals(roleId)) {
  // 拿到省级ID
  if (!"".equals(pid) && pid != null) {
      try {
   ctInfo = null;
   ctInfo = calService.queryCityId(pid);
   log.debug("二级联动:市级数据"
    + JSONSerializer.toJSON(ctInfo).toString());
      } catch (Exception e) {
   log.error(e);
      }
      JSONSerializer.toJSON(ctInfo).toString();
  }
     }
     // 判断是否市级用户
     if ("2".equals(roleId) || "3".equals(roleId)) {
  // 拿到市级ID
  if (!"".equals(pid) && pid != null) {
      try {
   ctInfo = null;
   ctInfo = calService.queryCityIdIsCityRole(pid);
   log.debug("二级联动:市级数据"
    + JSONSerializer.toJSON(ctInfo).toString());
      } catch (Exception e) {
   log.error(e);
      }
      JSONSerializer.toJSON(ctInfo).toString();
  }
     }
 }

 return SUCCESS;
    }

    /**
     * 通过现在了市级,动态加载县区信息
     *
     * @return String 如果有违例,请使用@exception/throws [违例类型]
     *         [违例说明:异常的注释必须说明该异常的含义及什么条件下抛出该
     * @see [类、类#方法、类#成员]
     */
    public String queryAreaInfo() {
 log.debug("二级联动:CityAreaLinkAction.queryAreaInfo bean");
 try {
     areaInfo = calService.queryCityId(this.getCid());
     JSONSerializer.toJSON(areaInfo).toString();
     log.debug("二级联动:区级数据" + JSONSerializer.toJSON(areaInfo).toString());
 } catch (Exception e) {
     log.error(e);
 }
 return SUCCESS;

    }

    public List<TbSysAreaInfo> getCtInfo() {
 return ctInfo;
    }

    public void setCtInfo(List<TbSysAreaInfo> ctInfo) {
 this.ctInfo = ctInfo;
    }

    public void setCalService(CityAreaLinkService calService) {
 this.calService = calService;
    }

    public List<TbSysAreaInfo> getAreaInfo() {
 return areaInfo;
    }

    public void setAreaInfo(List<TbSysAreaInfo> areaInfo) {
 this.areaInfo = areaInfo;
    }

    public String getCid() {
 return cid;
    }

    public void setCid(String cid) {
 this.cid = cid;
    }

}

 

5.2: 地区实体表 TbSysAreaInfo。java

package com.onecom.amp.system.common.domain;

import com.onecom.onecomframework.domain.OneComPlatformBaseBean;

/**
 * 地区信息实体表
 *
 * @author tangx
 * @version V100 Jul 24, 2013
 * @see [相关类/方法]
 * @since ONECOMTECH.COM V100R001C00
 *
 */
public class TbSysAreaInfo extends OneComPlatformBaseBean {
    /**
     * 属性serialVersionUID
     */
    private static final long serialVersionUID = 4236322846064371283L;
    // 地区ID
    private String areaId;
    // 地区名
    private String areaName;
    // 上级ID
    private String parentId;

    public String getAreaId() {
 return areaId;
    }

    public void setAreaId(String areaId) {
 this.areaId = areaId;
    }

    public String getAreaName() {
 return areaName;
    }

    public void setAreaName(String areaName) {
 this.areaName = areaName;
    }

    public String getParentId() {
 return parentId;
    }

    public void setParentId(String parentId) {
 this.parentId = parentId;
    }

}

 

5.3:dao层和service层我省了,就是一个方法调用,最后把对象的ibatis的xml的sql配置贴出来

 <typeAlias alias="TbSysAreaInfo_cityarea"
  type="com.onecom.amp.system.common.domain.TbSysAreaInfo" />

 <resultMap id="TbSysAreaInfoResult"
  class="TbSysAreaInfo_cityarea">
  <result column="AREAID" property="areaId" />
  <result column="AREANAME" property="areaName" />
  <result column="PARENTID" property="parentId" />
 </resultMap>

 <select id="queryAreaIdByPid" resultMap="TbSysAreaInfoResult"
  parameterClass="java.lang.String">
  SELECT AREAID,AREANAME,PARENTID FROM TB_SYS_AREAINFO WHERE
  PARENTID=#pid# AND ISSELECTED=1
 </select>


 <select id="queryAreaIdIsCityRoleByPid"
  resultMap="TbSysAreaInfoResult" parameterClass="java.lang.String">
  SELECT AREAID,AREANAME,PARENTID FROM TB_SYS_AREAINFO WHERE
  AREAID=#pid# AND ISSELECTED=1
 </select>

 

大致有这些了。文件的位置对应自己的项目跟着放就行了,我自己的项目能跑起来。好了一个动态的2级联动就出来了。

 


 

 
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值