Easyui的combobox實(shí)現(xiàn)動(dòng)態(tài)數(shù)據(jù)級(jí)聯(lián)效果
實(shí)現(xiàn)從數(shù)據(jù)庫(kù)中動(dòng)態(tài)獲取對(duì)應(yīng)的List集合,并在Easyui的combobox中顯示出來。
實(shí)現(xiàn)的效果如下:
1、數(shù)據(jù)庫(kù)的表設(shè)計(jì)如圖所示
2、數(shù)據(jù)庫(kù)中填寫相關(guān)的數(shù)據(jù),如圖所示。如圖所示【法律法規(guī)】是所屬欄目,因此他的字段parentid是0?!局袊?guó)公民出國(guó)】、【內(nèi)地居民往來港澳】是屬于法律法規(guī)的類別。因此他們的字段parentid是對(duì)應(yīng)1,【法律法規(guī)】的字段categoryid是1.
3、相關(guān)的配置:已經(jīng)在前面的博客中寫了http://chabaoo.cn/article/86381.htm
這里就不多寫。只把關(guān)鍵代碼貼出來。
4、對(duì)應(yīng)的Action代碼
package crj.portal.web.management.action; import java.io.IOException; import java.util.List; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import net.sf.json.JSONArray; import net.sf.json.JSONObject; import net.sf.json.JsonConfig; import org.apache.log4j.Logger; import org.apache.struts2.ServletActionContext; import org.hibernate.Criteria; import org.hibernate.criterion.Order; import com.sun.tools.javac.util.Log; import crj.portal.web.management.model.Cpersontypetbl; import crj.portal.web.management.service.CategoryService; import crj.portal.web.management.service.ItemService; import crj.portal.web.management.service.UserService; public class ItemManageAction { Logger log=Logger.getLogger(this.getClass()); private String page; private String rows; private String lanmuid; private ItemService itemService;// 依賴注入 //下拉框--查詢欄目 public String categorytbl() throws Exception{ List list=itemService.queryLanMu(); this.toJsonArray(list); return null; } //根據(jù)欄目的ID 查詢擁有的類別 public String leibie() throws Exception{ List list=itemService.queryLeiBie(lanmuid); this.toJsonArray(list); return null; } public String toJsonArray(List list) throws IOException{ HttpServletResponse response = ServletActionContext.getResponse(); HttpServletRequest request = ServletActionContext.getRequest(); JSONArray json = JSONArray.fromObject(list); log.info("JSON格式:" +json.toString()); response.setCharacterEncoding("utf-8");// 指定為utf-8 response.getWriter().write(json.toString());// 轉(zhuǎn)化為JSOn格式 return null; } public String save() throws Exception { return this.alllist(); } public ItemService getItemService() { return itemService; } public void setItemService(ItemService itemService) { this.itemService = itemService; } public String getPage() { return page; } public void setPage(String page) { this.page = page; } public String getRows() { return rows; } public void setRows(String rows) { this.rows = rows; } public UserService getUserService() { return userService; } public void setUserService(UserService userService) { this.userService = userService; } public CategoryService getCategoryService() { return categoryService; } public void setCategoryService(CategoryService categoryService) { this.categoryService = categoryService; } public String getLanmuid() { return lanmuid; } public void setLanmuid(String lanmuid) { this.lanmuid = lanmuid; } }
5、對(duì)應(yīng)的接口代碼
public interface ItemService { //下拉框--查詢欄目 public List queryLanMu() throws Exception; //下拉框--查詢類別 public List queryLeiBie(String ids) throws Exception; }
6、對(duì)應(yīng)的接口實(shí)現(xiàn)類代碼
public class ItemServiceImpl implements ItemService { Logger log = Logger.getLogger(this.getClass()); private SessionFactory sessionFactory; //下拉框--查詢欄目 public List queryLanMu() throws Exception { Criteria criteria=this.sessionFactory.getCurrentSession().createCriteria(Categorytbl.class); criteria.add(Restrictions.eq("parentid", 0)); criteria.addOrder(Order.asc("categoryid")); return criteria.list(); } //下拉框--查詢類別 public List queryLeiBie(String ids) throws Exception { int i=Integer.parseInt(ids); Criteria criteria=this.sessionFactory.getCurrentSession().createCriteria(Categorytbl.class); criteria.add(Restrictions.eq("parentid", i)); criteria.addOrder(Order.asc("categoryid")); return criteria.list(); } public SessionFactory getSessionFactory() { return sessionFactory; } public void setSessionFactory(SessionFactory sessionFactory) { this.sessionFactory = sessionFactory; } }
7、對(duì)應(yīng)的JSP代碼
<%@ page language="java" errorPage="/error.jsp" pageEncoding="utf-8"%> <%@ taglib prefix="s" uri="/struts-tags"%> <% String path = request.getContextPath(); %> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>信息管理</title> <!-- 引入Jquery --> <script type="text/javascript" src="<%=path%>/easyui_1.3.2/jquery-1.8.0.min.js" charset="utf-8"></script> <!-- 引入Jquery_easyui --> <script type="text/javascript" src="<%=path%>/easyui_1.3.2/jquery.easyui.min.js" charset="utf-8"></script> <!-- 引入easyUi國(guó)際化--中文 --> <script type="text/javascript" src="<%=path%>/easyui_1.3.2/locale/easyui-lang-zh_CN.js" charset="utf-8"></script> <!-- 引入easyUi默認(rèn)的CSS格式--藍(lán)色 --> <link rel="stylesheet" type="text/css" href="<%=path%>/easyui_1.3.2/themes/default/easyui.css" /> <!-- 引入easyUi小圖標(biāo) --> <link rel="stylesheet" type="text/css" href="<%=path%>/easyui_1.3.2/themes/icon.css" /> <script type="text/javascript"> /* 初始化下載表格信息 */ $(function() { // 下拉框選擇控件,下拉框的內(nèi)容是動(dòng)態(tài)查詢數(shù)據(jù)庫(kù)信息 $('#lanmu').combobox({ url:'itemManage!categorytbl', editable:false, //不可編輯狀態(tài) cache: false, panelHeight: 'auto',//自動(dòng)高度適合 valueField:'categoryid', textField:'categoryName', onHidePanel: function(){ $("#leibie").combobox("setValue",''); var lanmuid = $('#lanmu').combobox('getValue'); $.ajax({ type: "POST", url: "itemManage!leibie?lanmuid="+lanmuid, cache: false, dataType : "json", success: function(data){ $("#leibie").combobox("loadData",data); } }); } }); $('#leibie').combobox({ //url:'itemManage!categorytbl', editable:false, //不可編輯狀態(tài) cache: false, panelHeight: 'auto',//自動(dòng)高度適合 valueField:'categoryid', textField:'categoryName' }); }); </script> </head> <body> <!-- 工具攔 --> <div id="tb" style="padding: 3px"> <form > <span>所屬欄目:</span> <select id="lanmu" class="lanmu" style="width:160px; border: 1px solid #ccc"> </select> <span>類別:</span> <select id="leibie" class="leibie" style="width:160px; border: 1px solid #ccc"> </select> </form> </div> </body> </html>
以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
- EasyUI學(xué)習(xí)之Combobox下拉列表(1)
- EasyUI學(xué)習(xí)之Combobox級(jí)聯(lián)下拉列表(2)
- jQuery EasyUI編輯DataGrid用combobox實(shí)現(xiàn)多級(jí)聯(lián)動(dòng)
- Easyui form combobox省市區(qū)三級(jí)聯(lián)動(dòng)
- 如何解決easyui自定義標(biāo)簽 datagrid edit combobox 手動(dòng)輸入保存不上
- EasyUI中combobox默認(rèn)值注意事項(xiàng)
- jQuery+easyui中的combobox實(shí)現(xiàn)下拉框特效
- jquery easyui combobox模糊過濾(示例代碼)
- jQuery EasyUI API 中文文檔 - ComboBox組合框
- easyUI combobox實(shí)現(xiàn)聯(lián)動(dòng)效果
相關(guān)文章
Java集合定義與用法實(shí)例總結(jié)【Set、List與Map】
這篇文章主要介紹了Java集合定義與用法,結(jié)合實(shí)例形式總結(jié)分析了Java集合中Set、List和Map相關(guān)概念、功能、用法及操作注意事項(xiàng),需要的朋友可以參考下2018-08-08Java基礎(chǔ)之extends用法詳解及簡(jiǎn)單實(shí)例
這篇文章主要介紹了 Java基礎(chǔ)之extends用法詳解及簡(jiǎn)單實(shí)例的相關(guān)資料,需要的朋友可以參考下2017-02-02java文件下載代碼實(shí)例(單文件下載和多文件打包下載)
這篇文章主要介紹了java文件下載代碼實(shí)例(單文件下載和多文件打包下載),文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2019-12-12DUCC配置平臺(tái)實(shí)現(xiàn)一個(gè)動(dòng)態(tài)化線程池示例代碼
這篇文章主要為大家介紹了DUCC配置平臺(tái)實(shí)現(xiàn)一個(gè)動(dòng)態(tài)化線程池示例代碼,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-02-02