服务于区块链开拓者

www.zhidnet.com

  博客园  :: 首页  :: 新随笔  :: 联系 :: 订阅 订阅  :: 管理

Jsp页面上的下拉框代码按照如下格式写:<select name="selA" id="selA" onchange="buildSelect(this.value, 'selB','${ctx}/baseset/BltPermission/searchMenu.action?parentId=')">。其中id必填且唯一,onchange配置公共方法buildSelect。buildSelect方法的第一个参数是当前下拉框的值,第二个参数是下级联动下拉框的id,第三个参数是查询下级联动下拉框的值的集合的url,其中parentId用来传递当前下拉框的值,可以根据实际功能自行配置。

用bug模块的无限联动效果实例:

<s:select id="projectId" name="projectId" list="projectList" listValue="projectName" listKey="projectId" headerKey="%{model.projectId}" theme="simple" cssClass="" disabled="true" ></s:select>

在select中添加onchange事件onchange="buildSelect(this.value, 'selB','/bug/LgpBug_searchAssign.action?parentId=')"。其中url为产生下拉值集合的action。在框架中buildSelect函数实现如下:

function buildSelect(selectId,childId,url){

    if (selectId == "") {                                                     //selectId为空串表示选中了默认项

        clearOptions(document.getElementById(childId));                         //清除目标列表及下级列表中的选项

        document.getElementById(childId).onchange();

        return;                                                                //直接结束函数调用,不必向服务器请求信息

    }

    targetId = childId;

    var pars = "";

    url = url+ selectId;

    var myAjax = new Ajax.Request(

                    url,

                    {

                    method: 'get',

                    parameters: pars,

                    onComplete: afterSelect

                });

}

this.value的值最终会拼接到url上,所以parentId的值为this.value的值。在action中获得parentid的值后进行操作

使用ajax提交数据后回传数据进行数据处理,数据格式采用json串的格式

function afterSelect(originalRequest){

       //alert(originalRequest.responseText);

        var optionsInfo = JSON.parse(originalRequest.responseText);   //将从服务器获得的文本转为对象直接量

        var targetSelNode = document.getElementById(targetId);         //得到下级对象

 

        clearOptions(targetSelNode);                                      //清除目标列表中的选项

       

       if(optionsInfo == null){

           return;

       }

       //遍历对象直接量中的成员

       for(var i=0; i < optionsInfo.list.length; i++){

      

           targetSelNode.appendChild(createOption(optionsInfo.list[i].menuId, optionsInfo.list[i].menuName)); //在目标列表追加新的选项

       }

           

       targetSelNode.onchange();

}

//根据传入的value和text创建选项

function createOption(value, text) {

    var opt = document.createElement("option");      //创建一个option节点

    opt.setAttribute("value", value);              //设置value

    opt.appendChild(document.createTextNode(text));  //给节点加入文本信息

    return opt;

}

 

//清除传入的列表节点内所有选项

function clearOptions(selNode) {

    selNode.length = 1;             //设置列表长度为1,仅保留默认选项

    selNode.options[0].selected = true;            //选中默认选项

}

注意:targetId是js中的全局变量。在js中处理返还的json数据,转换为对象类型变量后在js中遍历展示添加到option中。

 

在action中

public String searchAssign(){
  String parentId=this.getRequest().getParameter("parentId");
  List list=lgpBugService.searchAssign(parentId);
  String str=JSONUtil.getJsonString(list);
  try {
   this.getResponse().setCharacterEncoding("utf8");
   this.getResponse().getWriter().write(str);
  } catch (IOException e) {
   e.printStackTrace();
  }
  
  return null;
 }

获得产生的数据对象添加到response中。注意必须设置response的编码方法,因为ajax的request提交用的是get方法,存在乱码问题。

service层:

public List searchAssign(String parentId){
  return lgpBugDao.searchAssign(parentId);
 }

dao层:

public List searchAssign(String parentId){
  String sql="select new com.luguang.bug.model.LgpBugExtends(c.userId,c.userAlias)from LgpProject as a ,LgpProjectGroup as b ,LgmUser as c where 1=1"
   +" and a.projectId=b.projectId "
   +" and b.userId=c.userId";
  List userList=new ArrayList<LgpBugExtends>();
  userList=this.getHibernateTemplate().find(sql);
  return userList;
 }

其中的LgpBugExtends类定义如下:

public class LgpBugExtends extends BaseEntity{
 private Long menuId;
 private String menuName;
 public Long getMenuId() {
  return menuId;
 }
 public void setMenuId(Long menuId) {
  this.menuId = menuId;
 }
 public String getMenuName() {
  return menuName;
 }
 public void setMenuName(String menuName) {
  this.menuName = menuName;
 }
 public LgpBugExtends(Long menuId, String menuName) {
  super();
  this.menuId = menuId;
  this.menuName = menuName;
 }
 public LgpBugExtends() {
  super();
 }
 public LgpBugExtends(Long menuId) {
  super();
  this.menuId = menuId;
 }
 

}

在定义该类时必须提供menuId,menuName属性,因为在jsp中处理json数据时访问的就是这两个属性,用来设置下拉框的listkey和listvalue属性。

返还的json数据格式如下:

list:{{menuId:id1,menuName:name1},{menuId:id2,menuName:name2},{},{}}所以必须按照这种数据格式来设计添加到下拉框中的类对象。

 

posted on 2013-09-26 14:37  知点网  阅读(404)  评论(0编辑  收藏  举报