您的位置:首页 > 编程语言 > Java开发

一个完整(详细注释分析)的整合hibernate与struts连接数据库的三级联动

2013-05-12 20:20 645 查看
1.主要实现功能效果图如下:






2.项目案例分析由于地方有限,这里只列出核心代码,js的编写源码和struts的源码;更多源码,以及数据库见本人资源,0分上传,免费供大家参考学习:tianyazaiheruan尊重别人的劳动成果与知识产权,转载请指明出处:杨凯专属频道该项目为一个整合hibernate与struts,利用json对象存放临时数据库数据,连接数据的三级联动;改项目使用ajax传递请求连接和参数;数据库结果为三表级联,三表之间依次都是多对一的关系;其中代码核心代码都附有详细的注释,供大家研讨学习;其中包括:Select.js:主要实现功能的js;Util.js:工具js,封装一些ajax的请求方法以及创建ajax的方法还有模拟jQuery的根据id获取dom对象;Struts.xml:主要亮点在配置一个多变级联时防止加载多个表的操作,从而达到解决多表级联操作的时候经常出现的session已关闭的bug3.核心代码Select.js:主要实现功能的jswindow.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_r("(" + xhr.responseText + ")");// 获取存放在json对象中的省份数组var jsonprovinces = provinceObj.provinces;// 遍历省份数组for ( var i = 0; i < jsonprovinces.length; i++) {// 得到具体的省var jsonProvince = jsonprovinces[i];// 创建显示省的optionvar provinceOption = document.createElement_x("option");// 设置option标签中具体省的value值provinceOption.setAttribute("value", jsonProvince.pid);// 设置option标签中具体省的文本,并追加option中provinceOption.appendChild(document.createTextNode(jsonProvince.pname));// 将省的option追加到省的selectprovinceDom.appendChild(provinceOption);}}function getProvinceFail() {alert("获取省份失败!");}
// 实现市的操作provinceDom.onchange = function() {// 获取发生改变事件的省的idvar 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_r("(" + xhr.responseText + ")");// 由城市的json对象获取城市的数组var jsonCities = cityObj.cities;for ( var i = 0; i < jsonCities.length; i++) {// 得到一个具体的市对象var jsonCity = jsonCities[i];var cityOption = document.createElement_x("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_r("(" + xhr.responseText + ")");var jsonCountries = countryObj.countries;for ( var i = 0; i < jsonCountries.length; i++) {var jsonCountry = jsonCountries[i];var countryOption = document.createElement_x("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.getElementByIdx_x(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"-//Apache Software Foundation//DTD Struts Configuration 2.3//EN""http://struts.apache.org/dtds/struts-2.3.dtd">
method="{1}">
provinces\[\d+\]\.pid,provinces\[\d+\]\.pname/index.jsp
method="{1}">cities\[\d+\]\.cid,cities\[\d+\]\.cname/index.jsp
method="{1}">countries\[\d+\]\.tid,countries\[\d+\]\.tname/index.jsp
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  it 三级联动