在一個jsp頁面實現二級下拉框聯動

2024-09-05 00:19:47

字體：大中小

來源：轉載

供稿：網友

　　在一個jsp頁面實現二級下拉框聯動，實時讀取數據庫數據。

在一個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>