在一個jsp頁面實現二級下拉框聯動,即時讀取資料庫資料,這個方法非常有用,只需要修改很小的地方就可以使用。設計的檔案,serch.jsp,main.js,bytetostr.js,
先講一下main.js,這是javascript,其中注意修改jsp頁面名稱。
以下為引用的內容: function findObject(fName,initValue)...{ var xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); xmlhttp.open("POST","searchmx.jsp?findObject="+fName+"&initValue="+initValue,false);//注意修改jsp頁面 xmlhttp.send(); document.getElementById(fName).innerHTML=bytes2BSTR(xmlhttp.responsebody); //bytes2BSTR函數在bytetostr.js中 } 其次為bytetostr.js,這是vbscript,這個不需要修改任何內容,他的主要功能就是讀取資料轉換字串用的。 Function bytes2BSTR(vIn) dim i strReturn = "" For i = 1 To LenB(vIn) ThisCharCode = AscB(MidB(vIn,i,1)) If ThisCharCode < &H80 Then strReturn = strReturn & Chr(ThisCharCode) Else NextCharCode = AscB(MidB(vIn,i+1,1)) strReturn = strReturn & Chr(CLng(ThisCharCode) * &H100 + CInt(NextCharCode)) i = i + 1 End If Next bytes2BSTR = strReturn End Function |
接下來就是serch.jsp頁面,只需要修改div中的id為你想要的名字,再將一開始的包更換一下,已經sql語句改下就可以了,有不明白的可以參與討論
以下為引用的內容:
<%@ page contentType="text/html; charset=gb2312" language="java" import="com.sjth.zdsygl.vo.*,com.sjth.zdsygl.biz.*,java.util.*,com.sjth.zdsygl.jdbc.*,java.sql.ResultSet"%>//匯入相應的包 <% //這部分代碼用於執行查詢資料庫,返回字串 if (request.getParameter("findObject")!=null)...{ if (request.getParameter("findObject").equals("hy_dm"))...{ DBConnect conn = null; ResultSet rs = null; try...{ out.print("<select name='hy_dm' onchange="javascript:findObject('hymx_dm',this.value)">"); String sql = "select * from dm_hy group by left(hy_dm,7)"; conn = new DBConnect(); conn.setPstmt(sql); rs = conn.executeQuery(sql); while(rs.next())...{ out.print("<option value='"+rs.getString("hy_dm")+"'>"+rs.getString("hy_mc")+"</option>"); } out.print("</select>"); } catch (Exception e)...{ } finally...{ try...{ if (rs != null) rs.close(); if (conn != null) conn.close(); } catch (Exception e)...{ e.printStackTrace(); } } } if (request.getParameter("findObject").equals("hymx_dm"))...{ DBConnect conn = null; ResultSet rs = null; try...{ out.print("<select name='hymx_dm' >"); String sql = null; if (request.getParameter("initValue").equals(""))...{ sql = "select * from dm_hy"; } else...{ sql = "select * from dm_hy where hy_dm like '"+request.getParameter("initValue")+"%'"; } conn = new DBConnect(); conn.setPstmt(sql); rs = conn.executeQuery(sql); while(rs.next())...{ out.print("<option value='"+rs.getString("hy_dm")+"'>"+rs.getString("hy_mc")+"</option>"); } out.print("</select>"); } catch (Exception e)...{ } finally...{ try...{ if (rs != null) rs.close(); if (conn != null) conn.close(); } catch (Exception e)...{ e.printStackTrace(); } } } return; } %> <html> <head> <link href="CSS/table.css" type="text/css" rel="stylesheet"> <script language=vbscript src="css/bytetostr.js"></script> <script language=javascript src="css/main.js"></script>//匯入兩個js檔案 </head> <body> <div>所屬行業:</div> <div id="hy_dm"></div> //用來顯示返回的字串 <div >所屬明細行業:</div> <div id="hymx_dm"></div>//用來顯示返回的字串 </body> </html> <script language="javascript"> findObject("hy_dm",""); findObject("hymx_dm","");//這兩條是頁面執行是調用 </script> |
歡迎大家討論