JSP select下拉选择

最新推荐文章于 2024-06-19 09:33:02 发布

碧海潮音001

最新推荐文章于 2024-06-19 09:33:02 发布

阅读量1.9k

点赞数

CC 4.0 BY-SA版权

分类专栏： Web 文章标签： css html5 html

本文链接：https://blog.youkuaiyun.com/hwbwdm/article/details/120152027

Web 专栏收录该内容

5 篇文章

订阅专栏

本文档展示了如何使用Java与SQL Server数据库交互，实现公司选择下拉框的动态填充。通过JDBC连接数据库，获取数据并动态生成选项，便于前端用户快速选择。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ page import="java.sql.*" %>
<style type="text/css">
body {
background-color: #0fb0f5;
}

table {
   border:solid thin white;
   max-width: 1300px;
   border-color: #ffffff;
   border-spacing: 0px;
   border-collapse: initial;
   display: table;
}

table td {
   border:solid thin white;
   padding: 1px;
   font-size: 10px;
   min-width: 400px;
   text-aling: center;
   box-sizing: border-box;
}

table th {
   border:solid thin white;
   padding: 2px;
   min-width: 100px;
   text-aling: center;
   box-sizing: border-box;
}
</style>
<body>
   <%
   String DBDRIVER="com.microsoft.sqlserver.jdbc.SQLServerDriver";
   String DBURL="jdbc:sqlserver://IP:1433;DatabaseName=DBName";
   String DBUSER="DBUser";
   String PASSWORD="DBPassWord";
   %>
   <tr>
       <th>公司：</th>
       <td>
       <select id="project" name="project_id" style="width:280px;height:30px;text-align:center" required>
<option value="" selected="selected">请选择公司</option>
<%
           //连接数据库
            try{
       Class.forName(DBDRIVER);
       Connection cn=DriverManager.getConnection(DBURL,DBUSER,PASSWORD);
       Statement st=cn.createStatement();
       String sql="SELECT * from table";
       ResultSet rs=st.executeQuery(sql);
       while(rs.next()) //循环输出数据
                {
               out.print("<option value="+rs.getString(1)+">"+rs.getString(2)+"</option>");
                }
       rs.close();//关闭结果集
       cn.close();//关闭操作
       }
       catch(Exception ex){
       System.out.println(ex.getMessage());
       System.out.println("连接异常");
       ex.printStackTrace();
       }

       %>
           </select>
       </td>
   </tr>

   <script>
   // 查看所选
   chooseCostCenter();
   function chooseCostCenter(){
   var obj = document.getElementById("project");
   var sele = obj.options;
   obj.onchange = function(){
   var index = obj.selectedIndex;
   if(index > 0){
   console.log(sele[index].value);
   alert(sele[index].value);
   }
   }
   }
   </script>

</body>