ajax做三级联动

很多地方需要ajax三级联动才能完成功能;我就按我的步聚来一步一步写,如果有不懂,可以Q我,我也可以发包给他.  对了,用struts 和 hibernate 容易实现

先经过一个login.jsp页面,这个页面主要是实现一次请求,来查询表,查询出三级联动的第一级

(国家--省份--市),先查出 国家,

login.jsp

 

 

<%...@ page contentType="text/html;charset=UTF-8" %>
<html>
<head>
   <script>...
   function loginDiv()
   ...{
      window.location.href="index.do?action=findFinace&id=0";
   }
   </script>
</head>
<body>
   <form >
      <input type="button" value="点击进入AJAX三级联动" οnclick="loginDiv()"><p>
     
   </form>
</body>
</html>
 2,点击经过action ,调用find方法

 

 

/**//*
 * Generated by MyEclipse Struts
 * Template path: templates/java/JavaClass.vtl
 */
package com.demo;


import java.io.BufferedWriter;
import java.io.FileOutputStream;
import java.io.FileWriter;
import java.io.IOException;
import java.io.PrintWriter;
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.util.ArrayList;
import java.util.Iterator;
import java.util.List;
import java.util.Vector;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import org.apache.struts.action.Action;
import org.apache.struts.action.ActionForm;
import org.apache.struts.action.ActionForward;
import org.apache.struts.action.ActionMapping;
import org.apache.struts.actions.DispatchAction;
import org.hibernate.Session;
import org.hibernate.SessionFactory;
import org.hibernate.Transaction;
import org.hibernate.cfg.Configuration;
import org.jdom.Document;
import org.jdom.Element;
import org.jdom.output.Format;
import org.jdom.output.XMLOutputter;

import com.demo.pojo.Area;
import com.demo.pojo.Bbs;
import com.demo.pojo.Financing;

/** *//**
 * MyEclipse Struts
 * Creation date: 11-08-2007
 *
 * XDoclet definition:
 * @struts.action path="/login" name="loginForm" scope="request"
 */
public class IndexAction extends DispatchAction...{
    /**//*
     * Generated Methods
     */

    /** *//**
     * Method execute
     * @param mapping
     * @param form
     * @param request
     * @param response
     * @return ActionForward
     */
    public ActionForward query(ActionMapping mapping, ActionForm form,
            HttpServletRequest request, HttpServletResponse response) ...{
        response.setContentType("text/xml");
        response.setHeader("Cache-Control", "no-cache");
        response.setCharacterEncoding("UTF-8");

        String strid=request.getParameter("id");
        if(strid!=null)...{
            int id=Integer.parseInt(request.getParameter("id"));
            Integer idt=new Integer(id);
            Session session =this.getSesion();
            Transaction tx=null;
            tx=session.beginTransaction();

            List listProv=session.createQuery(" from Area as a where a.areaid="+idt).list();
            Document doc=new Document();
            Element root=new Element("roots");
            /**//*for(Object o:listProv){
                System.out.println("eeeeeeeeeeeeeeeeeeeeeeeee");
                Element prov=new Element("provs");
                prov.addContent(new Element("area").addContent(((Area)o).getArea()));
                //prov.addContent(((Area)o).getArea());
                root.addContent(prov);
            }*/
           
            //  锟矫碉拷锟斤拷
            Iterator iter=listProv.iterator();
            while(iter.hasNext())...{
                Area area=(Area)iter.next();
                Element prov=new Element("provs");
                prov.addContent(new Element("areas").addContent(area.getArea()));
                prov.addContent(new Element("id").addContent(area.getId().toString()));
                root.addContent(prov);
            }
            doc.addContent(root);
            XMLOutputter outputter=new XMLOutputter(Format.getPrettyFormat().setEncoding("UTF-8"));
            try ...{
               
                //PrintWriter wr = new PrintWriter(new BufferedWriter(new FileWriter("c:\do.txt")));
                outputter.output(doc,response.getWriter());
            } catch (Exception e) ...{
                // TODO Auto-generated catch block
                e.printStackTrace();
            }
            tx.commit();

        }
                return null;
       
    }
   
    public ActionForward find(ActionMapping mapping, ActionForm form,
            HttpServletRequest request, HttpServletResponse response) ...{
        response.setCharacterEncoding("UTF-8");
        Session session =this.getSesion();
        Transaction tx=null;
        tx=session.beginTransaction();
        List listCountry=session.createQuery(" from Area as a where areaid=0").list();
        request.setAttribute("listCountry", listCountry);
        tx.commit();
        session.close();
       
        return mapping.findForward("index");
    }
   
    public Session getSesion()...{
        SessionFactory sessionFactory=null;
        Configuration config=new Configuration().configure("hibernate.cfg.xml");
        sessionFactory=config.buildSessionFactory();
       
        Session session =sessionFactory.openSession();
        return session;
    }
   
}
返回三级联动页面

index.jsp

 

 

<%...@ page contentType="text/html;charset=UTF-8"%>
<%...@ taglib uri="/WEB-INF/struts-html.tld" prefix="html"  %>
<%...@ taglib uri="/WEB-INF/struts-bean.tld" prefix="bean"  %>
<%...@ taglib uri="/WEB-INF/struts-logic.tld" prefix="logic" %>
<html>
  <head>

  <title>My JSP ''index.jsp'' starting page</title>
  </head>
  <script type="text/javascript" src="../script/calendar.js"></script>
  <script>...
      var xmlHttp;
      function cerateXMLHttpRequest()
      ...{
          if(window.XMLHttpRequest)
          ...{
              xmlHttp = new XMLHttpRequest();
          }else if(window.ActiveXObject)
          ...{
              try...{
                  xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
              }catch(e)...{
                  try...{
                      xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
                  }catch(e)...{
                      alert("创建异步对象失败");
                  }
              }
          }
          if(!xmlHttp)
          ...{
              alert("创建异步对象失败");
              return;
          }
      }

     
      //利用ajaxa+struts做三级联动
      //选择国家
      function selectCountry(country)
      ...{
         if(country=="")
         ...{
            document.f.selectProvince.options.length = 1;
            document.f.selectCity.options.length = 1;
            return;
         }
         sendSelectCountry("index.do?action=query&id="+country);
      }
      //ajaxa发送函数,发送国家
      function sendSelectCountry(url)
      ...{
          cerateXMLHttpRequest();
          xmlHttp.open("get",url,true);
          xmlHttp.onreadystatechange=processCountry;
          //xmlHttp.setRequestHeader(''Content-type'',''application/x-www-form-urlencoded'');
          xmlHttp.send(null);
         
      }
      //以国家来 返回省的响应函数
      function processCountry()
      ...{
         if(xmlHttp.readyState==4)
          ...{
              if(xmlHttp.status==200)
              ...{
                 var doc=xmlHttp.responseXML;
                 var pro=doc.getElementsByTagName("provs");
                 document.f.selectProvince.options.length = 1;
                 document.f.selectCity.options.length = 1;
                 for(var i=0;i<pro.length;i++)...{
                    var p=pro[i];
                    document.f.selectProvince.add(new Option(p.childNodes[0].firstChild.data,p.childNodes[1].firstChild.data));
                 }
                
                

              }else...{
                  alert("请求页面异常");
              }
          }
      }
     
      //选择省份
      function selectProv(province)
      ...{
         if(province=="")
         ...{
            document.f.selectCity.options.length = 1;
            return;
         }
         sendSelectProvince("index.do?action=query&id="+province);
      }
      //ajaxa发送函数,发送省份
      function sendSelectProvince(url)
      ...{
          cerateXMLHttpRequest();
          xmlHttp.open("get",url,true);
          xmlHttp.onreadystatechange=processProvince;
          //xmlHttp.setRequestHeader(''Content-type'',''application/x-www-form-urlencoded'');
          xmlHttp.send(null);
         
      }
      //以省份来 返回 市的响应函数
      function processProvince()
      ...{
         if(xmlHttp.readyState==4)
          ...{
              if(xmlHttp.status==200)
              ...{
                 var doc=xmlHttp.responseXML;
                 var pro=doc.getElementsByTagName("provs");
                 document.f.selectCity.options.length = 1;
                 for(var i=0;i<pro.length;i++)...{
                    var p=pro[i];
                    document.f.selectCity.add(new Option(p.childNodes[0].firstChild.data,p.childNodes[1].firstChild.data));
                 }
                
                

              }else...{
                  alert("请求页面异常");
              }
          }
      }
     
  </script>
 
  <body>
      <form name="f">
          <h3 id="findmates">利用ajaxa+struts做三级联动</h3>
                           
                                    <p>
                                        请选择国家<select name="province" οnchange="selectCountry(this.value)">
                                                        <option value="">--请选择--</option>
                                                    
                                                   <logic:present name="listCountry">
                                                      <logic:iterate collection="${listCountry}"  id="lis">
                                                          <option value="${lis.id }">${lis.area }</option>          
                                                       </logic:iterate>
                                                    </logic:present>
                                                 </select>
                                        请选择省份<select name="selectProvince" οnchange="selectProv(this.value)">
                                                    <option value="">--请选择--</option>
                                                   
                                                </select>
                                        请选择市<select name="selectCity">
                                                    <option value="">--请选择--</option>
                                                </select>
                                    </p>
                                   
                                               
                             
       
      </form>
  </body>
</html>

点击国家,他就会去通过ajax 调用 action里面的 query()方法

在把值给下一级

struts-config.xml和 hibernate.hibernate.cfg.xml 怎么配制 我想你们会知道怎么配制

 

文章出处:http://www.diybl.com/course/3_program/java/javashl/2007123/89678.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
经导师精心指导并认可、获 98 分的毕业设计项目!【项目资源】:微信小程序。【项目说明】:聚焦计算机相关专业毕设及实战操练,可作课程设计与期末大作业,含全部源码,能直用于毕设,经严格调试,运行有保障!【项目服务】:有任何使用上的问题,欢迎随时与博主沟通,博主会及时解答。 经导师精心指导并认可、获 98 分的毕业设计项目!【项目资源】:微信小程序。【项目说明】:聚焦计算机相关专业毕设及实战操练,可作课程设计与期末大作业,含全部源码,能直用于毕设,经严格调试,运行有保障!【项目服务】:有任何使用上的问题,欢迎随时与博主沟通,博主会及时解答。 经导师精心指导并认可、获 98 分的毕业设计项目!【项目资源】:微信小程序。【项目说明】:聚焦计算机相关专业毕设及实战操练,可作课程设计与期末大作业,含全部源码,能直用于毕设,经严格调试,运行有保障!【项目服务】:有任何使用上的问题,欢迎随时与博主沟通,博主会及时解答。 经导师精心指导并认可、获 98 分的毕业设计项目!【项目资源】:微信小程序。【项目说明】:聚焦计算机相关专业毕设及实战操练,可作课程设计与期末大作业,含全部源码,能直用于毕设,经严格调试,运行有保障!【项目服务】:有任何使用上的问题,欢迎随时与博主沟通,博主会及时解答。
1. 智慧监狱概述 智慧监狱的建设背景基于监狱信息化的发展历程,从最初的数字化监狱到信息化监狱,最终发展到智慧监狱。智慧监狱强调管理的精细化、监管的一体化、改造的科学化以及办公的无纸化。政策上,自2017年以来,司法部连续发布了多项指导性文件,推动智慧监狱的建设。 2. 内在需求与挑战 智慧监狱的内在需求包括数据应用与共享的不足、安防系统的单一功能、IT架构的复杂性、信息安全建设的薄弱以及IT运维的人工依赖。这些挑战要求监狱系统进行改革,以实现数据的深度利用和业务的智能化。 3. 技术架构与设计 智慧监狱的技术架构包括统一门户、信息安全、综合运维、安防集成平台和大数据平台。设计上,智慧监狱采用云计算、物联网、大数据和人工智能等技术,实现资源的动态分配、业务的快速部署和安全的主动防护。 4. 数据治理与应用 监狱数据应用现状面临数据分散和共享不足的问题。智慧监狱通过构建数据共享交换体系、数据治理工具及服务,以及基于数据仓库的数据分析模型,提升了数据的利用效率和决策支持能力。 5. 安全与运维 智慧监狱的信息安全建设涵盖了大数据应用、安全管理区、业务区等多个层面,确保了数据的安全和系统的稳定运行。同时,综合运维平台的建立,实现了IT系统的统一管理和自动化运维,提高了运维效率和系统的可靠性。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值