一個完整(詳細註釋分析)的整合hibernate與struts連線資料庫的三級聯動
1.主要實現功能效果圖如下:
2.專案案例分析
由於地方有限,這裡只列出核心程式碼,js的編寫原始碼和struts的原始碼;更多原始碼,以及資料庫見本人資源,0分上傳,免費供大家參考學習:tianyazaiheruan
尊重別人的勞動成果與智慧財產權,轉載請指明出處:楊凱專屬頻道
該專案為一個整合hibernate與struts,利用json物件存放臨時資料庫資料,連線資料的三級聯動;改專案使用ajax傳遞請求連線和引數;資料庫結果為三表級聯,三表之間依次都是多對一的關係;其中程式碼核心程式碼都附有詳細的註釋,供大家研討學習;
其中包括:Select.js:主要實現功能的js;Util.js:工具js,封裝一些ajax的請求方法以及建立ajax的方法還有模擬jQuery的根據id獲取dom物件;Struts.xml:主要亮點在配置一個多變級聯時防止載入多個表的操作,從而達到解決多表級聯操作的時候經常出現的session已關閉的bug
3.核心程式碼
Select.js:主要實現功能的js
window.onload = function() {
// 建立省份的節點物件
var provinceDom = $("province");
// 建立市的節點物件
var cityDom = $("city");
// 建立城鎮的節點物件
var countryDom = $("country");
// 實現省的操作
// 傳送ajax請求
var url = "./csdn/ProvinceAction_select.action?time="
+ new Date().getTime();
sendGet(content, url, getProvinceSuccess, getProvinceFail);
function getProvinceSuccess(xhr) {
// 獲取省份的json物件
var provinceObj = eval("(" + xhr.responseText + ")");
// 獲取存放在json物件中的省份陣列
var jsonprovinces = provinceObj.provinces;
// 遍歷省份陣列
for ( var i = 0; i < jsonprovinces.length; i++) {
// 得到具體的省
var jsonProvince = jsonprovinces[i];
// 建立顯示省的option
var provinceOption = document.createElement("option");
// 設定option標籤中具體省的value值
provinceOption.setAttribute("value", jsonProvince.pid);
// 設定option標籤中具體省的文字,並追加option中
provinceOption.appendChild(document
.createTextNode(jsonProvince.pname));
// 將省的option追加到省的select
provinceDom.appendChild(provinceOption);
}
}
function getProvinceFail() {
alert("獲取省份失敗!");
}
// 實現市的操作
provinceDom.onchange = function() {
// 獲取發生改變事件的省的id
var pid = this.value;
// 判斷是否需要查詢的操作
if (pid != -1) {
// 傳送ajax請求
var url = "./csdn/CityAction_select.action?time="
+ new Date().getTime();
var content = "pid=" + pid;
sendPost(content, url, getCitySuccess, getCityFail);
}
};
function getCitySuccess(xhr) {
// 清空資料;清空市
cityDom.length = 1;
// 得到城市的json物件
var cityObj = eval("(" + xhr.responseText + ")");
// 由城市的json物件獲取城市的陣列
var jsonCities = cityObj.cities;
for ( var i = 0; i < jsonCities.length; i++) {
// 得到一個具體的市物件
var jsonCity = jsonCities[i];
var cityOption = document.createElement("option");
// 設定省的value值
cityOption.setAttribute("value", jsonCity.cid);
// 設定省的文字,並追加option中
cityOption.appendChild(document.createTextNode(jsonCity.cname));
cityDom.appendChild(cityOption);
}
}
function getCityFail(xhr) {
}
// 實現城鎮的操作
cityDom.onchange = function() {
var cid = this.value;
// 判斷是否需要查詢的操作
if (cid != -1) {
// 傳送ajax請求
var url = "./csdn/CountryAction_select.action?time="
+ new Date().getTime();
var content = "cid=" + cid;
sendPost(content, url, getcountrySuccess, getcountryFail);
}
};
function getcountrySuccess(xhr) {
// 清空資料:城鎮
countryDom.length = 1;
var countryObj = eval("(" + xhr.responseText + ")");
var jsonCountries = countryObj.countries;
for ( var i = 0; i < jsonCountries.length; i++) {
var jsonCountry = jsonCountries[i];
var countryOption = document.createElement("option");
countryOption.setAttribute("value", jsonCountry.tid);
countryOption.appendChild(document
.createTextNode(jsonCountry.tname));
countryDom.appendChild(countryOption);
}
}
function getcountryFail(xhr) {
alert("獲取城鎮失敗!");
}
};
Util.js:工具js,封裝一些ajax的請求方法以及建立ajax的方法還有模擬jQuery的根據id獲取dom物件
//通過id獲取dom物件
function $(id) {
return document.getElementById(id);
}
// ajax技術必須建立XMLHTTPRequest物件 ,獲取XMLHTTPRequest物件的操作
function createXHR() {
var xhr;
var aVersion = [ "MSXML2.XMLHttp.5.0", "MSXML2.XMLHttp.4.0",
"MSXML2.XMLHttp.3.0", "MSXML2.XMLHttp", "Microsoft.XMLHttp" ];
try {
// 高版本ie、firefox、opera等瀏覽器直接new出ajax物件
xhr = new XMLHttpRequest();
} catch (e) {
// 低版本的IE,ie6以下版本需要通過以下操作建立ajax物件
for ( var i = 0; i < aVersion.length; i++) {
try {
xhr = new ActiveXObject(aVersion[i]);
return xhr;
} catch (e) {
continue;
}
}
}
return xhr;
}
//post方式傳送請求的方法
function sendPost(content, url, success, fail) {
var xhr = createXHR();
// 觸發器
xhr.onreadystatechange = function() {
if (xhr.readyState == 4) {
if (xhr.status == 200 || xhr.status == 304) {
success(xhr);
} else {
fail(xhr);
}
}
};
// 開啟請求
xhr.open("POST", url, true);
// 設定型別
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
// 傳送請求
xhr.send(content);
}
//get方式傳送請求的方法
function sendGet(content, url, success, fail) {
var xhr = createXHR();
// 觸發器
xhr.onreadystatechange = function() {
if (xhr.readyState == 4) {
if (xhr.status == 200 || xhr.status == 304) {
success(xhr);
} else {
fail(xhr);
}
}
};
// 開啟請求
xhr.open("GET", url+"?"+content, true);
// 傳送請求
xhr.send(null);
}
Struts.xml:主要亮點在配置一個多變級聯時防止載入多個表的操作,從而達到解決多表級聯操作的時候經常出現的session已關閉的bug
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE struts PUBLIC
"-//Apache Software Foundation//DTD Struts Configuration 2.3//EN"
"http://struts.apache.org/dtds/struts-2.3.dtd">
<struts>
<include file="www/csdn/project/resource/struts-constant.xml" />
<package name="csdn" namespace="/csdn" extends="json-default">
<action name="ProvinceAction_*" class="www.csdn.project.action.ProvinceAction"
method="{1}">
<result type="json">
<!-- 改配置引數為關鍵,如果不設定改引數json物件會預設載入城市類導致出現session已關閉的錯誤 -->
<param name="includeProperties">provinces\[\d+\]\.pid,provinces\[\d+\]\.pname</param>
</result>
<result name="input">/index.jsp</result>
</action>
<action name="CityAction_*" class="www.csdn.project.action.CityAction"
method="{1}">
<result type="json">
<param name="includeProperties">cities\[\d+\]\.cid,cities\[\d+\]\.cname</param>
</result>
<result name="input">/index.jsp</result>
</action>
<action name="CountryAction_*" class="www.csdn.project.action.CountryAction"
method="{1}">
<result type="json">
<param name="includeProperties">countries\[\d+\]\.tid,countries\[\d+\]\.tname</param>
</result>
<result name="input">/index.jsp</result>
</action>
</package>
</struts>
相關文章
- 一個省市縣三級聯動的回顯(帶資料庫)資料庫
- 如何設定Struts 連線資料庫的公共類,作個公共的類,來連線資料庫,如何寫???資料庫
- 求助: 用Hibernate連線多個資料庫的問題?資料庫
- hibernate資料庫連線池的問題資料庫
- 詳細闡述交換機的三種連線方式:級聯、堆疊和叢集
- 一個資料庫連線池的問題資料庫
- R資料分析:生存分析的列線圖的理解與繪製詳細教程
- golang連線達夢資料庫的一個坑Golang資料庫
- 求一個完美的連線資料庫的類資料庫
- 建立一個連線資料庫的VB元件 (轉)資料庫元件
- 資料庫與python的連線資料庫Python
- .Net與Oracle的資料庫連線Oracle資料庫
- DBeaver如何連線一個資料庫資料庫
- Spring mvc+struts2+Hibernate整合例項程式碼(註解詳解)SpringMVC
- 資料庫表連線的簡單解釋資料庫
- 原生javascript製作省市區三級聯動詳細教程JavaScript
- 關於同一個連線不同資料庫之間的 Eloquent 關聯查詢資料庫
- SQL Server資料庫檢視一個資料表各列的註釋SQLServer資料庫
- sqlHelper類的中文 詳細註釋SQL
- 資料庫的連線資料庫
- Yii連線多個資料庫的方法資料庫
- 資料庫連線 系列一:laravel框架如何連線兩個資料庫(不同伺服器)資料庫Laravel框架伺服器
- 監控資料庫連線遇到的一個小問題資料庫
- [Sqlite] Java使用jdbc連線Sqlite資料庫進行各種資料操作的詳細過程SQLiteJavaJDBC資料庫
- 求救:hibernate3連結資料庫infomix連線不上資料庫
- ORACLE資料庫升級詳細步驟Oracle資料庫
- 一個網站完整詳細的SEO優化方案網站優化
- LINUX ln命令硬連線軟連線詳細解釋Linux
- 基於layui的省市區三級聯動(資料互動)UI
- 自己實現一個資料庫連線池資料庫
- 資料科學的整合與細分資料科學
- 資料庫的連線數資料庫
- 連線資料庫的疑惑資料庫
- 資料庫的連線串資料庫
- JDBC連線三種資料庫例子JDBC資料庫
- 如何連線一個像 MSSQL 或者 orcale 一樣的外部資料庫SQL資料庫
- 各種連線資料庫的連線字串資料庫字串
- PHP資料庫長連線mysql_pconnect的細節PHP資料庫MySql