Java琐事

-I am not alone
posts - 54, comments - 30, trackbacks - 0, articles - 1
  BlogJava :: 首页 :: 新随笔 :: 联系 :: 聚合  :: 管理

使用DWR整合spring进行下拉框二级级联（10月12日）

Posted on 2010-10-12 22:34 石子路口 阅读(1804) 评论(0)  编辑  收藏 所属分类: 网络教学资源平台
框架使用struts2+spring+hibernate，但这里DWR只是跟spring的整合，和其余两个框架没有什么关系。
目的：打开页面时自动刷新课程，而当选择另外的课程时，栏目下拉框会发生相应变化。
页面代码addContent.jsp：
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>

<%@ taglib prefix="s" uri="/struts-tags" %>
<html>
    <head>
        <meta http-equiv="content-type" content="text/html;charset=utf-8">
    
        <title>FCKeditor</title>
        
        <script type="text/javascript" src="/wsjx/dwr/engine.js"></script>
        <script type="text/javascript" src="/wsjx/dwr/util.js"></script>
        <script type="text/javascript"
            src="/wsjx/dwr/interface/contentDaoAjax.js"></script>

        <script type="text/javascript"> <!--
            
            function updateCourse()
            {
                var teacher = "1";
                
                contentDaoAjax.getCourses(teacher , createCourses);
            }
            function createCourses(courses)
            {
                var courseObj = document.getElementById('course');
                DWRUtil.removeAllOptions(courseObj);
                DWRUtil.addOptions(courseObj,{0:"请选择"});
                if(courses.length == 0)
                {
                    alert("输入有误");
                }
                else
                {
                    DWRUtil.addOptions(courseObj,courses);
                }
            }
            
            function updateColumn()
            {
                var course = document.getElementById("course").value;
                contentDaoAjax.getColumns(course , createColumns);
            }
            function createColumns(columns)
            {
                var columnObj = document.getElementById('column');
                DWRUtil.removeAllOptions(columnObj);
                if(columns.length == 0)
                {
                    alert("输入有误");
                }
                else
                {
                    DWRUtil.addOptions(columnObj,columns);
                }
            }
    //--> </script>
    </head>

    <body onload="updateCourse()">
        <form>
            <table align="center">
                <tr>
                    <td><br/>课程: 
                    </td>
                    <td><br/><select name="course" id="course" onchange="updateColumn()"></select>
                    </td>
                </tr>
                
                <tr>
                    <td style="background-color: red" colspan="2"></td>
                </tr>
                <tr>
                    <td>栏目: 
                    </td>
                    <td><select name="mknr.lm.id" id="column"><option value="0" selected>请选择</option></select>
                    </td>
                </tr>
                <tr>
                    <td> <s:textfield name="mknr.title" size="100" label="题目" /> </td>
                </tr>
                                <tr>
                    <td>
                        <input type="submit" value="Submit">
                    </td>
                </tr>
            </table>

        </form>

    </body>
</html>

上面部分使用了struts2的标签，<select name="mknr.lm.id">也是为向后面的action传递值做准备，这里关于ajax的配置并没有用到name。
web.xml加入以下几句：
<!-- DWR servlet 配置 -->
    <servlet>
        <servlet-name>dwr</servlet-name>
        <servlet-class>
            org.directwebremoting.servlet.DwrServlet
        </servlet-class>
        <init-param>
            <param-name>debug</param-name>
            <param-value>true</param-value>
        </init-param>
        <load-on-startup>1</load-on-startup>
    </servlet>
    <servlet-mapping>
        <servlet-name>dwr</servlet-name>
        <url-pattern>/dwr/*</url-pattern>
    </servlet-mapping>
dwr.xml
<!DOCTYPE dwr PUBLIC
  "-//GetAhead Limited//DTD Direct Web Remoting 1.0//EN"
  "http://www.getahead.ltd.uk/dwr/dwr10.dtd">
  
  <dwr>
      <allow>
          <create javascript="contentDaoAjax" creator="spring">
              <param name="beanName" value="contentService"></param>
          </create>
      </allow>
  </dwr>
因为我这里没用到复杂的对象，而只是用到了简单的Map（int,String），所以并不需要设置convert。如果是传输的是javabean，则需要进行转换。
applicationContext.xml添加contentService的bean：
<bean id="contentService"
        class="cn.edu.ujn.wsjx.managecontent.service.impl.ContentService">
        
        <property name="mknrDao">
            <ref bean="mknrDao"/>
        </property>
        <property name="jsjkDao">
            <ref bean="jsjkDao"/>
        </property>
        <property name="lmDao">
            <ref bean="lmDao"/>
        </property>
        <property name="yhDao">
            <ref bean="yhDao"/>
        </property>
    </bean>
java类中相应的两个方法
 1public Map getCourses(String teacher)
 2    {
 3        List<Jsjk> jsjks = jsjkDao.findByTeacherId(1);
 4        Map map = new LinkedHashMap();
 5        for (Jsjk jsjk : jsjks)
 6        {
 7            Kc kc = jsjk.getKcId();
 8            System.out.println(kc.getName());
 9            map.put(kc.getId(), kc.getName());
10        }
11        return map;
12    }
13    
14    public Map getColumns(int course)
15    {
16        
17        List<Lm> lms = lmDao.findByCourse(course);
18        Map map = new LinkedHashMap();
19        for(Lm lm : lms)
20        {
21            System.out.println(lm.getName());
22            map.put(lm.getId(), lm.getName());
23        }
24        return map;
25    }
这么一系列配置好以后，就能实现无刷新二级级联了

只有注册用户登录后才能发表评论。
网站导航: