posts - 84,  comments - 54,  trackbacks - 0

 

     public  ActionForward getOrganinfo_ajax(ActionMapping mapping, ActionForm form,
            HttpServletRequest request, HttpServletResponse response) 
{
        String level2OrganId  
=  request.getParameter( " level2OrganId " );
        System.out.print(level2OrganId);
        IDReportLogic dreportLogic 
=  (IDReportLogic)SpringFactory.getBeanFactory().getBean( " dreportLogic " );
        
        response.setContentType(
" text/xml;charset=UTF-8 " );
        response.setHeader(
" Cache-control " " no-cache " );

        
try {
            
            String orgLevel 
=  request.getParameter( " orgLevel " );
            String orgId 
=  request.getParameter( " orgId " );
            
            

/*
以下为前台当中接受到的xml结构。

            StringBuffer sb = new StringBuffer();
            sb.append("<?xml version=\"1.0\" encoding=\"UTF-8\"?>");
            String str="<select><kkk><value>11111</value><text>北京</text></kkk>";
            String str2="<kkk><value>3333</value><text>上海</text></kkk></select>";
            sb.append(str);
            sb.append(str2);
*/

            
            PrintWriter out 
=  response.getWriter();
            out.write(str);
            out.flush();
            
return   null ;
        }
  catch  (Exception e)  {
            
//  TODO 自动生成 catch 块
            request.setAttribute( " info " " 获取二级机构异常! " );
            e.printStackTrace();
            
return  mapping.getInputForward();
        }

        
    }





二级机构:

                      
                  
< select name = " secOrganIdSel "  id = " secOrganIdSel "
                  onchange
= " selectChangeListener('2',this.options[this.selectedIndex].value); " >
                      
< option value = " -1 " > 请选择机构.. </ option >
</ select >

    三级机构:
                  
< select name = " thdOrganIdSel "  id = " thdOrganIdSel "
                  onchange
= " selectChangeListener('3',this.options[this.selectedIndex].value); " >
                      
< option value = " -1 " > 请选择机构.. </ option >

</ select >

四级机构:
                  
< select name = " forthOrganIdSel " >
                      
< option value = " -1 " > 请选择机构.. </ option >
                  
</ select >

  1    < script language = " javascript "  type = " text/javascript " >
  2        var  xmlHttp;
  3       
  4        function  createXMLHttpRequest() {
  5            if  (window.ActiveXObject) {
  6                xmlHttp  =   new  ActiveXObject( " Microsoft.XMLHTTP " );
  7           }
else   if (window.XMLHttpRequest) {
  8                xmlHttp  =   new  XMLHttpRequest();
  9           }

 10       }

 11       
 12        // 查询指定页面
 13        function  selectChangeListener(orgLevel,orgId) {
 14       
 15         createXMLHttpRequest();
 16       
 17          var  url =   " <%=request.getContextPath()%>/dreportAction.do?method=getOrganinfo_ajax&orgLevel= " + orgLevel + " &orgId= " + orgId;
 18         xmlHttp.open( " get " ,url, true );
 19          if (orgLevel  ==  ' 2 ') {
 20              // 如果是选择默认的第一个,则是清空后面3级机构和4级机构。
 21              var  tempSel  =  document.getElementById( " secOrganIdSel " );
 22              if (tempSel.options[tempSel.selectedIndex].value  ==   - 1 ) {
 23                  var  tempSel_1  =  document.getElementById( " thdOrganIdSel " );
 24                   tempSel_1.options.length  =   1 ;
 25                    var  tempSel_2  =  document.getElementById( " forthOrganIdSel " );
 26                   tempSel_2.options.length  =   1 ;
 27                    return   false ;
 28             }

 29             xmlHttp.onreadystatechange  =  callback2;
 30         }
else   if (orgLevel  ==  ' 3 ') {
 31              // 如果三级机构默认的是第一个选项,则清空第4级机构
 32             
 33              var  tempSel  =  document.getElementById( " thdOrganIdSel " );
 34              if (tempSel.options[tempSel.selectedIndex].value  ==   - 1 ) {
 35                  var  tempSel_2  =  document.getElementById( " forthOrganIdSel " );
 36                   tempSel_2.options.length  =   1 ;
 37                  return   false ;
 38             }

 39             xmlHttp.onreadystatechange  =  callback3;
 40         }

 41         
 42         xmlHttp.send( null );
 43      }

 44      
 45       // 返回信息处理,二级机构下拉列表返回结果
 46       function  callback2() {
 47          if  (xmlHttp.readyState  ==   4
 48            if  (xmlHttp.status  ==   200
 49                var  xmlDoc  =  xmlHttp.responseXML;
 50               changeSel(' 2 ',xmlDoc);
 51           }
else {
 52                 window.alert( " 您所请求的页面有异常。 " );
 53           }

 54         }
          
 55      }

 56      
 57      
 58       // 返回信息处理,三级机构下拉列表返回结果
 59       function  callback3() {
 60          if  (xmlHttp.readyState  ==   4
 61            if  (xmlHttp.status  ==   200
 62                var  xmlDoc  =  xmlHttp.responseXML;
 63               changeSel(' 3 ',xmlDoc);
 64           }
else {
 65                 window.alert( " 您所请求的页面有异常。 " );
 66           }

 67         }
          
 68      }

 69      
 70       // 更新机构下拉列表
 71       function  changeSel(orgLevel,xmlDoc) {
 72      
 73            // var xsel = xmlDoc.getElementsByTagName('kkk');
 74            var  xsel  =  xmlDoc.documentElement.childNodes;
 75
 76            // alert(xsel.length);
 77            if (orgLevel  ==  ' 2 ') {
 78                // 二级机构,3级机构和4级机构需要清空。
 79                var  tempSel_1  =  document.getElementById( " thdOrganIdSel " );
 80               tempSel_1.options.length  =   0 ;
 81               tempSel_1.add( new  Option('请选择机构',' - 1 '))
 82                var  tempSel_2  =  document.getElementById( " forthOrganIdSel " );
 83               tempSel_2.options.length  =   0 ;
 84               tempSel_2.add( new  Option('请选择机构',' - 1 '))
 85               
 86                for ( var  i  =   0 ; i  <  xsel.length;i ++ ) {
 87                    var  xvalue  =  xsel[i].childNodes[ 0 ].firstChild.nodeValue;
 88                    var  xtext  =   xsel[i].childNodes[ 1 ].firstChild.nodeValue;
 89                    var  option  =   new  Option(xtext,xvalue);
 90                   tempSel_1.add(option);
 91               }

 92               
 93           }
else   if (orgLevel  ==  ' 3 ') {
 94                // 三级机构,四级机构需要清空
 95
 96                var  tempSel_2  =  document.getElementById( " forthOrganIdSel " );
 97               tempSel_2.options.length  =   0 ;
 98               tempSel_2.add( new  Option('请选择机构',' - 1 '))
 99               
100                 for ( var  i  =   0 ; i  <  xsel.length;i ++ ) {
101                    var  xvalue  =  xsel[i].childNodes[ 0 ].firstChild.nodeValue;
102                    var  xtext  =   xsel[i].childNodes[ 1 ].firstChild.nodeValue;
103                    var  option  =   new  Option(xtext,xvalue);
104                   tempSel_2.add(option);
105               }

106               
107           }

108          
109      }

110
111
112   </ script >
posted on 2008-04-07 14:49 JavaCoffe 阅读(4040) 评论(8)  编辑  收藏 所属分类: JavaScript&AjaxAjax


FeedBack:
# re: ajax+struts实现多级下拉列表联动,无刷新
2008-04-08 12:50 | beijixuem
建议楼主把代码提供下载呀!看这有点乱呀!你也用spring 了吧?  回复  更多评论
  
# re: ajax+struts实现多级下拉列表联动,无刷新[未登录]
2008-04-10 09:30 | javacoffe
@beijixuem
代码是齐全的,你仔细看看。action当中的xml结构是模拟的,看你的机构是怎么设置的。
  回复  更多评论
  
# re: ajax+struts实现多级下拉列表联动,无刷新
2008-04-11 12:51 | dreamli
好东西啊!  回复  更多评论
  
# re: ajax+struts实现多级下拉列表联动,无刷新
2008-04-14 16:33 | onejavaer
楼主,把你完整的练习源码发给我一份好吗,学习一下,谢谢!

onejavaer@126.com  回复  更多评论
  
# re: ajax+struts实现多级下拉列表联动,无刷新
2008-04-15 12:52 | JavaCoffe
上面代码是齐全的,你放到actiong当中或servlet,jsp当中都可以,只要模拟出xml结构就行。
剩下的就是html当中的js代码,考入到相应的一个jsp页面或者html页面就行。  回复  更多评论
  
# re: ajax+struts实现多级下拉列表联动,无刷新
2008-04-15 13:46 | onejavaer
好的,学习下,谢谢~~!  回复  更多评论
  
# re: ajax+struts实现多级下拉列表联动,无刷新
2008-11-27 14:49 | 哎呀
代码是不错,就是不会用  回复  更多评论
  
# re: ajax+struts实现多级下拉列表联动,无刷新[未登录]
2009-12-14 21:37 | 呵呵
哥们可以给个详细的例子么?我现在正在做这个 我想要的效果就是像淘宝上的
你去卖东西时的那个效果 http://sell.taobao.com/auction/publish/publish.htm?auction_type=b 不知道能实现了么?  回复  更多评论
  

只有注册用户登录后才能发表评论。


网站导航:
 
<2008年4月>
303112345
6789101112
13141516171819
20212223242526
27282930123
45678910

常用链接

留言簿(5)

随笔分类(80)

收藏夹(1)

最新随笔

积分与排名

  • 积分 - 57540
  • 排名 - 898

最新评论

阅读排行榜