dwr实现的无刷新技术,详情见附件
DWR实现的N级联动无刷新效果
1,在web.xml文件里面配置这样一段:
<servlet>
<servlet-name>dwr</servlet-name>
<servlet-class>
uk.ltd.getahead.dwr.DWRServlet
</servlet-class>
<init-param>
<param-name>debug</param-name>
<param-value>true</param-value>
</init-param>
</servlet>
<servlet-mapping>
<servlet-name>dwr</servlet-name>
<url-pattern>/dwr/*</url-pattern>
</servlet-mapping>
2,把dwr.jar包加到lib文件夹里面。
3, 配置一个dwr.xml文件, 放在web.xml文件同级目录。内容配置如下:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE dwr PUBLIC "-//GetAhead Limited//DTD Direct Web Remoting 2.0//EN" "http://getahead.org/dwr/dwr20.dtd">
<dwr>
<allow>
<create creator="new" javascript="shoppingDisplay"
class="com.pg.marsng.reports.impl.SuperUserManageServiceImpl"/>
class对应的是自已所写的业务类名
<convert match="com.pg.marsng.reports.impl.
UserSelectBean"
converter="bean">
match对应的是实体类名
</convert>
</allow>
</dwr>
4,前期的准备工作已经做好,准备在jsp页面调用了。
导入3段js
<script type='text/javascript' src='<%=basePath %>dwr/interface/shoppingDisplay.js'></script>
<script type='text/javascript' src='<%=basePath%>dwr/engine.js'></script>
<script type='text/javascript' src='<%=basePath%>dwr/util.js'></script>
例如有2个下拉框
<select id=’r_area’ name=’r_area’
onChange=’changeR_area()’ >
//该段就是填充hub下拉框中的值
function changeR_area()
{
var domainId = document.getElementById("r_area").value;
if(domainId!= "all")
{
shoppingDisplay.getdomain_id_allInfo(domainId,
callBack_Hub) ;
}
}
function callBack_Hub(data)
{
dwr.util.removeAllOptions("HUB");
dwr.util.addOptions("HUB",data,"ID","SYS_NAME");
var domainId= document.getElementById("r_area").value;
}
//第二个hub下拉框变化时候的联动其他下拉框
<select id=’r_hub’ name=’r_hub’
onChange=’changeHUB()’ >
function changeHUB()
{
var domainId = document.getElementById("HUB").value;
}
function callBack_DAM(data)
{
dwr.util.removeAllOptions("DAM");
dwr.util.addOptions("DAM",data,"USER_ID","NAME");
}
DWR实现的N级联动无刷新效果
1,在web.xml文件里面配置这样一段:
<servlet>
<servlet-name>dwr</servlet-name>
<servlet-class>
uk.ltd.getahead.dwr.DWRServlet
</servlet-class>
<init-param>
<param-name>debug</param-name>
<param-value>true</param-value>
</init-param>
</servlet>
<servlet-mapping>
<servlet-name>dwr</servlet-name>
<url-pattern>/dwr/*</url-pattern>
</servlet-mapping>
2,把dwr.jar包加到lib文件夹里面。
3, 配置一个dwr.xml文件, 放在web.xml文件同级目录。内容配置如下:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE dwr PUBLIC "-//GetAhead Limited//DTD Direct Web Remoting 2.0//EN" "http://getahead.org/dwr/dwr20.dtd">
<dwr>
<allow>
<create creator="new" javascript="shoppingDisplay"
class="com.pg.marsng.reports.impl.SuperUserManageServiceImpl"/>
class对应的是自已所写的业务类名
<convert match="com.pg.marsng.reports.impl.
UserSelectBean"
converter="bean">
match对应的是实体类名
</convert>
</allow>
</dwr>
4,前期的准备工作已经做好,准备在jsp页面调用了。
导入3段js
<script type='text/javascript' src='<%=basePath %>dwr/interface/shoppingDisplay.js'></script>
<script type='text/javascript' src='<%=basePath%>dwr/engine.js'></script>
<script type='text/javascript' src='<%=basePath%>dwr/util.js'></script>
例如有2个下拉框
<select id=’r_area’ name=’r_area’
onChange=’changeR_area()’ >
//该段就是填充hub下拉框中的值
function changeR_area()
{
var domainId = document.getElementById("r_area").value;
if(domainId!= "all")
{
shoppingDisplay.getdomain_id_allInfo(domainId,
callBack_Hub) ;
}
}
function callBack_Hub(data)
{
dwr.util.removeAllOptions("HUB");
dwr.util.addOptions("HUB",data,"ID","SYS_NAME");
var domainId= document.getElementById("r_area").value;
}
//第二个hub下拉框变化时候的联动其他下拉框
<select id=’r_hub’ name=’r_hub’
onChange=’changeHUB()’ >
function changeHUB()
{
var domainId = document.getElementById("HUB").value;
}
function callBack_DAM(data)
{
dwr.util.removeAllOptions("DAM");
dwr.util.addOptions("DAM",data,"USER_ID","NAME");
}