下拉框的內容可以來自數據庫、枚舉、自己在程序中的定義等，我們今天來介紹一下先介紹來自數據庫的數據進行下拉列表的實現。

使用場景：客戶下拉列表等

---

?

1、確保數據庫中有相關客戶信息數據。

2、獲取數據格式(id，name)

<select id="getCusCustomerForSelect" resultType="java.util.Map">select id,Customer_Name as name from cus_customer</select>

3、返回數據類型List<Map<String,Object>>

List<Map<String,Object>> getCusCustomerForSelect();

4、在js中獲取生成下拉框所需要的數據

/*** 獲取客戶下拉列表* @param selectId*/ function getCusCustomerForSelect(selectId) {var $selectId = $("#" + selectId);var url = "commonCtrl/getCusCustomerForSelect";$.get(url, function (data) {var info = "<option value=''>請選擇</option>";for (var i = 0; i < data.length; i++) {info += "<option value=" + data[i].id + ">" + data[i].name + "</option>";}$selectId.append(info);layui.use('form', function () {var form = layui.form;form.render('select');})}) }

5、頁面上調用展示，本次使用的是layui

<select type="text" id="customerId" name="customerId" lay-filter="customerId" lay-searchautocomplete="off"></select>

js中調用

<script>var $ = layui.jquery;$(function () {getCusCustomerForSelect("customerId");}); </script>

?

轉載于:https://www.cnblogs.com/yangyuke1994/p/9999245.html

總結

以上是生活随笔為你收集整理的生成下拉框的几种方法总结——数据来源：数据库的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。