Example of select onchange event usage in jsp, selectonchange
This example describes how to use the select onchange event in jsp. We will share this with you for your reference. The details are as follows:
<Script language = "JavaScript"> var onecount; onecount = 0; subcat = new Array (); <% int count = 0; java. SQL. resultSet rs1 = DBManage.exe cuteQuery ("select hydm, zhydm, zhymc from zhy"); // read data while (rs1.next () {String selhydm = rs1.getString ("hydm "). trim (); String zhydm = rs1.getString ("zhydm "). trim (); String zhymc = rs1.getString ("zhymc "). trim (); %> subcat [<% = count %>] = new Array ("<% = zhydm %>", "<% = selhydm %> "," <% = Zhymc %> "); // generates an array <% count = count + 1;} if (rs1! = Null) DBManage. closeCOnn (); %> onecount = <% = count %>; function changelocation (id) {document. form1.selzhy. length = 0; var hydm = id; var I; document. form1.selzhy. options [0] = new Option ('select sub-industry category', ''); for (I = 0; I <onecount; I ++) {if (subcat [I] [1] = hydm) {document. form1.selzhy. options [document. form1.selzhy. length] = new Option (subcat [I] [2], subcat [I] [0]) ;}}</script> <table width = "500" border =" 0 "cellspacing =" 0 "cellpadding =" 0 "align =" center "> <tr> <td width =" 180 "height =" 20 "align =" right "> select industry category: </td> <td width = "320"> <select name = "selhy" onChange = "changelocation (document. form1.selhy. options [document. form1.selhy. selectedIndex]. value) "size =" 1 "> <option value =" 2 "> select industry Category </option> <% rs = DBManage.exe cuteQuery (" select * from hy "); while (rs. next () {String hydm = rs. getString ("hydm "). trim (); String hymc = rs. getString ("hymc "). trim (); %> <option value = "<% = hydm %>"> <% = hymc %> </option> <%} if (rs! = Null) DBManage. closeCOnn (); %> </select> </td> </tr> <td height = "20" align = "right"> select a sub-industry category: </td> <select name = "selzhy"> <option value = "" selected> select a sub-industry Category </option> </select> </td> </tr> </table> <form name = form1> <select name = province onchange = "cityName (this. selectedIndex) "> <option value =" "> select province name </option> </select> <select name = city> <option value =" "> select city name </option> </select> </form> <script language = javascript> var city1 = ["Hangzhou ", "Ningbo", "WenZhou", "Shaoxing", "Jinhua", "Huzhou"]; var city2 = ["Nanjing", "Suzhou", "Wuxi ", "Changzhou", "Zhenjiang", "Xuzhou"]; var city3 = ["Hefei", "zhuxian", "Huangshan", "Qimen", "Xiuning"]; var city4 = ["Nanchang", "Jiujiang", "Ganzhou", "Shangrao", "Xinyu", "Jingdezhen"]; var provinceName = ["Zhejiang ", "Jiangsu", "Anhui", "Jiangxi"]; function province () {var e = document. form1.province; for (var I = 0; I <provinceName. length; I ++) e. options. add (new Option (provinceName [I], provinceName [I]);} function cityName (n) {var e = document. form1.city; for (var I = e. options. length; I> 0; I --) e. remove (I); if (n = 0) return; var a = eval ("city" + n); // obtain the array name of the city for (var I = 0; I <. length; I ++) e. options. add (new Option (a [I], a [I]);} function window. onload () {province (); // grant content to the provincial name drop-down menu in the initial stage} </script>
I hope this article will help you with JSP program design.