Posted on 2006-05-25 01:10
誰伴我闖蕩 阅读(2817)
评论(3) 编辑 收藏
接着上次的话题,下面的就是学生注册时需要的学院,专业,班级,三层列表,
学院:
<html:select property="instituteId" onchange="getDepartments(this.value)">
<html:options collection="institutes" property="value" labelProperty="label"/>
</html:select>
专业:
<html:select property="departmentId" styleId="department" onchange="getClasses(this.value)"></html:select>
班级:
<html:select property="classId" styleId="classid" ></html:select>
学院是上来就应该有的,我们把他放到了LabelValueBean里
public Vector<LabelValueBean> getInstitutes()
{
Connection connection = null;
PreparedStatement pstmt = null;
ResultSet rs = null;
try
{
connection = getConnection();
pstmt = connection.prepareStatement( "select * from institute" );
rs = pstmt.executeQuery();
Vector<LabelValueBean> institutes = new Vector<LabelValueBean>();
institutes.add( new LabelValueBean( "请选择所在学院", "" ) );
while ( rs.next() )
{
institutes.add( new LabelValueBean(
rs.getString( "institute" ), rs.getString( "id" ) ) );
}
return institutes;
}
catch ( Exception e )
{
e.printStackTrace();
}
finally
{
close( rs );
close( pstmt );
close( connection );
}
return null;
}
而当它选择了一个学院后,相应的getDepartments(this.value)的js脚本就该工作了,还是四步
var xmlHttp;
function createXMLHttpRequest()
{
if (window.XMLHttpRequest)
{
xmlHttp = new XMLHttpRequest();
}
else if (window.ActiveXObject)
{
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
}
发出请求
function getDepartments(institute)
{
createXMLHttpRequest()
var url = "ajax.do?institute="+institute+"&method=getDepartments"
xmlHttp.open("GET",url, true)
xmlHttp.onreadystatechange = departments
xmlHttp.send(null)
}
处理响应
function departments()
{
if (xmlHttp.readyState == 4)
{
if (xmlHttp.status == 200)
{
resText = xmlHttp.responseText
each = resText.split("|")
buildSelect( each, document.getElementById("departmentId"), "请选择所在专业");
}
}
}
function buildSelect(str,sel,label)
{
sel.options.length=0;
sel.options[sel.options.length]=new Option(label,"")
for(var i=0;i<str.length;i++)
{
each=str[i].split(",")
sel.options[sel.options.length]=new Option(each[0],each[1])
}
}
我把从数据库中得到的各个专业进行了编码,之后再这里再回归回去,下面的是编码过程
public StringBuffer getDepartmentsByInstituteIdForAjax( Long instituteId )
{
Connection connection = null;
PreparedStatement pstmt = null;
ResultSet rs = null;
try
{
connection = getConnection();
pstmt = connection
.prepareStatement( "select * from department where instituteID=?" );
pstmt.setLong( 1, instituteId );
rs = pstmt.executeQuery();
StringBuffer sb = new StringBuffer();
while ( rs.next() )
{
sb.append( rs.getString( "department" ) + ","
+ rs.getLong( "id" ) );
if ( !rs.isLast() ) sb.append( "|" );
}
return sb;
}
catch ( Exception e )
{
e.printStackTrace();
}
finally
{
close( rs );
close( pstmt );
close( connection );
}
return null;
}
当然这些都是由
public ActionForward getDepartments( ActionMapping mapping,
ActionForm form, HttpServletRequest req, HttpServletResponse res )
throws Exception
{
Service service = getService();
res.getWriter().write(
service.getDepartmentsByInstituteIdForAjax(
Long.parseLong( req.getParameter( "institute" ) ) )
.toString() );
return null;
}
来控制
===========班级的再这里
public ActionForward getClasses( ActionMapping mapping, ActionForm form,
HttpServletRequest req, HttpServletResponse res ) throws Exception
{
Service service = getService();
res.getWriter().write(
service.getClassesByDepartmentIdForAjax(
Long.parseLong( req.getParameter( "department" ) ) )
.toString() );
return null;
}
public StringBuffer getClassesByDepartmentIdForAjax( Long departmentId )
{
Connection connection = null;
PreparedStatement pstmt = null;
ResultSet rs = null;
try
{
connection = getConnection();
pstmt = connection
.prepareStatement( "select * from class where departmentID=?" );
pstmt.setLong( 1, departmentId );
rs = pstmt.executeQuery();
StringBuffer sb = new StringBuffer();
while ( rs.next() )
{
sb.append( rs.getString( "class" ) + "," + rs.getLong( "id" ) );
if ( !rs.isLast() ) sb.append( "|" );
}
return sb;
}
catch ( Exception e )
{
e.printStackTrace();
}
finally
{
close( rs );
close( pstmt );
close( connection );
}
return null;
}
function getClasses(department)
{
createXMLHttpRequest()
var url = "ajax.do?department="+department+"&method=getClasses"
xmlHttp.open("GET",url, true)
xmlHttp.onreadystatechange = classes
xmlHttp.send(null)
}
function classes()
{
if (xmlHttp.readyState == 4)
{
if (xmlHttp.status == 200)
{
resText = xmlHttp.responseText
each = resText.split("|")
buildSelect( each, document.getElementById("classid"), "请选择所在班级");
}
}
}