假设我写了一个名字叫做query.jsp的页面,页面有两个form,姑且叫做form1,form2吧,大概为
<body>
<form name="form1" action="query.jsp">
<select name="departmentid">
<option value="3">市场部</option>
<option value="4">人事部</option>
<option value="5">综合管理部</option>
</select>
<input type="submit" value="查询" />
</form>
<form name="form2">
<table name="queryresult">
<% String depmid="";
String sqlquery="select * from department where id="+depmid;
......省略查询结果语句
%>
<tr><td>部门ID</td><td>部门领导</td></tr>
<tr><td><%=查询出来的部门ID%></td><td>><%=查询出来的部门领导%></td></tr>
</table>
</form>
</body>
第二个form的sql查询语句中depmid的值是来自语第一个form的departmentid控件选择值。即,当form1选择3时,form2的查询结果就是市场部的结果集,当form1选择4时,form2的查询结果就是人事部的结果集。在我的尝试中,我用这样的语句
depmid=request.getParameter("departmentid");或者
depmid=request.getAttribute("departmentid");都不成功,后台打印结果depmid=null;
问:怎样把departmentid的值赋给depmid??
另外,传统情况下,选择select 的值后还需要按旁边的 <input type="submit" value="查询" />这个按钮才能执行查询,怎么样才能是当选择select 的值后不需要按这个按钮就自动刷新form2的查询数据??
大家看清楚了喔,我写的 form1有个action属性,form2没有。呼唤好心人啊!!
<body>
<form name="form1" action="query.jsp">
<select name="departmentid">
<option value="3">市场部</option>
<option value="4">人事部</option>
<option value="5">综合管理部</option>
</select>
<input type="submit" value="查询" />
</form>
<form name="form2">
<table name="queryresult">
<% String depmid="";
String sqlquery="select * from department where id="+depmid;
......省略查询结果语句
%>
<tr><td>部门ID</td><td>部门领导</td></tr>
<tr><td><%=查询出来的部门ID%></td><td>><%=查询出来的部门领导%></td></tr>
</table>
</form>
</body>
第二个form的sql查询语句中depmid的值是来自语第一个form的departmentid控件选择值。即,当form1选择3时,form2的查询结果就是市场部的结果集,当form1选择4时,form2的查询结果就是人事部的结果集。在我的尝试中,我用这样的语句
depmid=request.getParameter("departmentid");或者
depmid=request.getAttribute("departmentid");都不成功,后台打印结果depmid=null;
问:怎样把departmentid的值赋给depmid??
另外,传统情况下,选择select 的值后还需要按旁边的 <input type="submit" value="查询" />这个按钮才能执行查询,怎么样才能是当选择select 的值后不需要按这个按钮就自动刷新form2的查询数据??
大家看清楚了喔,我写的 form1有个action属性,form2没有。呼唤好心人啊!!
实现局部刷新么,这不是
<%@ page language="java" pageEncoding="gb2312"%>
<%
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 'searchRegion.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 language="javascript">
var http_request = false;
function send_request(url)
{//初始化、指定处理函数、发送请求的函数
//alert("url\t"+url);
http_request = false;
//开始初始化XMLHttpRequest对象
if(window.XMLHttpRequest)
{ //Mozilla 浏览器
http_request = new XMLHttpRequest();
if(http_request.overrideMimeType)
{//设置MiME类别
http_request.overrideMimeType('text/xml');
}
}
else if(window.ActiveXObject)
{ // IE浏览器
try
{
http_request = new ActiveXObject("Msxml2.XMLHTTP");
}
catch(e)
{
try
{
http_request = new ActiveXObject("Microsoft.XMLHTTP");
}
catch(e){}
}
}
if(!http_request)
{ // 异常,创建对象实例失败
window.alert("不能创建XMLHttpRequest对象实例.");
return false;
}
http_request.onreadystatechange = processRequest;
// 确定发送请求的方式和URL以及是否同步执行下段代码
http_request.open("POST", url, true);
http_request.send(null);
}
// 处理返回信息的函数
function processRequest()
{
var imgs="<div id='div1'><img src='<%=path%>/pic2.gif'></div>";
document.getElementById('div1').innerHTML=imgs;
if (http_request.readyState == 4)
{ // 判断对象状态
if (http_request.status == 200)
{ // 信息已经成功返回,开始处理信息
var divhtml = http_request.responseText;
alert(divhtml);
//alert(divhtml);
//alert(document.getElementById('div1').innerHTML);
document.getElementById('div1').innerHTML=divhtml;
}
}
} function searchRegion()
{
var f = document.form1;
var province = f.province.value;
send_request('<%=path%>/searchRegion.do?province='+ province);
}
</script>
</head>
<body>
<FORM name="form1" action="" method="post">
<table>
<tr><td>
省
<select name="province" onchange="searchRegion()">
<option value=""></option>
<option value="hubei">hubei</option>
<option value="hunan">hunan</option>
<option value="beijing">beijing</option>
<option value="shandong">shandong</option>
</select>
</td>
<td>
<!-- <span id="div1"></span>-->
<div id="div1">
市
<select name="user" onchange="">
<option value="">----请选择----</option>
</select>
</div>
</td>
</tr>
</table>
</FORM>
</body>
</html>
package com.ascent.struts.action;import java.io.IOException;
import java.util.Iterator;
import java.util.List;import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import org.apache.struts.action.Action;
import org.apache.struts.action.ActionForm;
import org.apache.struts.action.ActionForward;
import org.apache.struts.action.ActionMapping;import com.ascent.struts.dao.CityDao;
import com.ascent.struts.dao.CityManager;
/**
* MyEclipse Struts
* Creation date: 12-26-2007
*
* XDoclet definition:
* @struts.action input="/searchRegion.jsp" validate="true"
*/
public class SearchRegionAction extends Action {
/*
* Generated Methods
*/ /**
* Method execute
* @param mapping
* @param form
* @param request
* @param response
* @return ActionForward
*/
public ActionForward execute(ActionMapping mapping, ActionForm form,
HttpServletRequest request, HttpServletResponse response) {
String province = request.getParameter("province");
CityDao um = new CityDao();
List list = um.searchCity(province);
String dthtml = "<div id='div1'>用户<select name='user' onchange=''><option value=''>----请选择----</option>";
if(list!=null && !list.isEmpty())
{
Iterator it = list.iterator();
CityManager city = null;
while(it.hasNext())
{
city = (CityManager)it.next();
dthtml = dthtml +"<option value='"+city.getId()+"'>"+city.getName()+"</option>"; }
}
dthtml = dthtml + "</select></div>";
try {
response.setContentType("text/html; charset=gb2312");
response.getOutputStream().print(dthtml);
} catch (IOException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
return null;
}
}
供参考
Dao层里的方法,其它一些bean类就不贴出来了,没有什么多大意义
<body>
<form name="form1" action="query.jsp">
<select name="departmentid">
<option value="3"> 市场部 </option>
<option value="4"> 人事部 </option>
<option value="5"> 综合管理部 </option>
</select>
<input type="submit" value="查询" />
<table name="queryresult">
<% String depmid="";
String sqlquery="select * from department where id="+depmid;
......省略查询结果语句
%>
<tr> <td> 部门ID </td> <td> 部门领导 </td> </tr>
<tr> <td> <%=查询出来的部门ID%> </td> <td> > <%=查询出来的部门领导%> </td> </tr>
</table>
</form>
</body>
通过Ajax里的xmlHttpRequest来传递相应的信息就可以了对照着看一下
我贴的jsp文件里的
<script language="javascript">
var http_request = false;
function send_request(url)
{//初始化、指定处理函数、发送请求的函数
//alert("url\t"+url);
http_request = false;
//开始初始化XMLHttpRequest对象
if(window.XMLHttpRequest)
{ //Mozilla 浏览器
http_request = new XMLHttpRequest();
if(http_request.overrideMimeType)
{//设置MiME类别
http_request.overrideMimeType('text/xml');
}
}
else if(window.ActiveXObject)
{ // IE浏览器
try
{
http_request = new ActiveXObject("Msxml2.XMLHTTP");
}
catch(e)
{
try
{
http_request = new ActiveXObject("Microsoft.XMLHTTP");
}
catch(e){}
}
}
if(!http_request)
{ // 异常,创建对象实例失败
window.alert("不能创建XMLHttpRequest对象实例.");
return false;
}
http_request.onreadystatechange = processRequest;
// 确定发送请求的方式和URL以及是否同步执行下段代码
http_request.open("POST", url, true);
http_request.send(null);
}
// 处理返回信息的函数
function processRequest()
{
var imgs="<div id='div1'><img src='<%=path%>/pic2.gif'></div>";
document.getElementById('div1').innerHTML=imgs;
if (http_request.readyState == 4)
{ // 判断对象状态
if (http_request.status == 200)
{ // 信息已经成功返回,开始处理信息
var divhtml = http_request.responseText;
alert(divhtml);
//alert(divhtml);
//alert(document.getElementById('div1').innerHTML);
document.getElementById('div1').innerHTML=divhtml;
}
}
} function searchRegion()
{
var f = document.form1;
var province = f.province.value;
send_request('<%=path%>/searchRegion.do?province='+ province);
}
</script>
这段脚本基本上差不多,基本上都是这么用,要详细了解可以去这里看一下Ajax的知识
大概意思就是通过div标签取代页面中需要刷新的内容,取代的内容就是你查询出来的东西设计成html标签的样式 <div id="div1">
市
<select name="user" onchange="">
<option value="">----请选择----</option>
</select>
</div>dthtml = dthtml +"<option value='"+city.getId()+"'>"+city.getName()+"</option>";
-----
我这里用了Struts,其实与这没有关系哈。你用Servlet是一样的
你说的选择下拉菜单就做改变,你看下我的贴出的jsp文件不是在
<select name="province" onchange="searchRegion()">
....这里调用了js函数,将你的结果传到服务器进行处理了。。当然你这里是直接传给当前jsp页面进行处理的,那你就得把相关的代码作为脚本嵌套进来
function searchRegion()
{
var f = document.form1;
var province = f.province.value;
send_request('<%=path%>*.jsp?province='+ depmid)
}你要做的事情很多,你的jsp文件都没有做呢
<body>
<form name="form1" action="query.jsp">
<select name="departmentid">
<option value="3" checked> 市场部 </option>
<option value="4"> 人事部 </option>
<option value="5"> 综合管理部 </option>
</select>
<input type="submit" value="查询" />
<table name="queryresult">
<% String depmid=request.getParameter("departmentid"); //今天下午不知什么原因居然不成功
String sqlquery="select * from department where id="+depmid;
......省略查询结果语句
%>
<tr> <td> 部门ID </td> <td> 部门领导 </td> </tr>
<tr> <td> <%=查询出来的部门ID%> </td> <td> > <%=查询出来的部门领导%> </td> </tr>
</table>
</form>
</body>
现在,当我在select选市场部,查询结果集就是市场部的信息了,但是,新的问题有出现了,当我选择综合管理部或者人事部的时候,虽然查询结果是对了,但是就是当我按下查询按钮的时候,select控件里面的文字却变成市场部,我开始以为是不是市场部的值是checked的缘故,于是我把checked去掉,问题还是这样,怎么办?
我搞这个问题已经很久了,准备十一点了,太不值得了。