Ajax---根据id从数据库查找对应的省份名称

本文主要是介绍Ajax---根据id从数据库查找对应的省份名称，对大家解决编程问题具有一定的参考价值，需要的程序猿们随着小编来一起学习吧！

使用Ajax访问数据库并实现局部更新

1、项目清单
2、代码
- 1 、index.jsp代码
- 2、Province代码
- 3、ProvinceDao类代码
- 3、QueryProviceServlet代码
- 4、web.xml代码
3、笔记

1、项目清单

在这里插入图片描述

2、代码

1 、index.jsp代码

在这里插入代码片<%--
  Created by IntelliJ IDEA.
  User: 福仔
  Date: 2022/2/26
  Time: 17:09
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
  <head>
    <title>Ajax根据省份id获取名称</title>
    <script type="text/javascript">
      function search() {
        //1、初始化对象
        var xmlHttp=new XMLHttpRequest();
        //2、绑定事件
        xmlHttp.onreadystatechange = function () {
          if( xmlHttp.readyState == 4 && xmlHttp.status== 200){
            //alert(xmlHttp.responseText)
            //更新页面，就是更新dom对象
            document.getElementById("proname").value= xmlHttp.responseText;
          }
        }
        //3.初始异步对象
        //获取proid文本框的值
        var proid = document.getElementById("proid").value;
        xmlHttp.open("get","queryProvice?proid="+proid,true);

        //4.发送请求
        xmlHttp.send();
      }
    </script>
  </head>
  <body>
  <p>ajax根据省份id获取名称</p>
  <table>
    <tr>
      <td>省份编号：</td>
      <td><input type="text" id="proid"/>
        <input type="button" value="搜索" onclick="search()"/>
      </td>

    </tr>
    <tr>
      <td>省份名称</td>
      <td><input type="text" id="proname"/></td>
    </tr>
  </table>
  </body>
<a href="html/main.jsp">link</a>
</html>

2、Province代码

package com.bjpowernode.entity;

public class Province {

    private Integer id;
    private String name;
    private String jiancheng;
    private String shenghui;

    public Integer getId() {
        return id;
    }

    public void setId(Integer id) {
        this.id = id;
    }

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    public String getJiancheng() {
        return jiancheng;
    }

    public void setJiancheng(String jiancheng) {
        this.jiancheng = jiancheng;
    }

    public String getShenghui() {
        return shenghui;
    }

    public void setShenghui(String shenghui) {
        this.shenghui = shenghui;
    }
}

3、ProvinceDao类代码

package com.bjpowernode.dao;

import com.bjpowernode.entity.Province;

import java.sql.*;

//使用jdbc访问数据库
public class ProvinceDao {

    //根据id获取名称
    public String queryProviceNameById(Integer proviceId){
        //声明变量
        Connection conn = null;
        PreparedStatement pst = null;
        ResultSet rs  = null;
        String sql= "";
        //定义参数
        String url="jdbc:mysql://localhost:3306/springdb";
        String username="root";
        String password="123456";
        //连接数据库
        String name = "";
        //加载驱动
        try {
            Class.forName("com.mysql.jdbc.Driver");
            conn = DriverManager.getConnection(url,username,password);
            //创建PreparedStatement
            sql="select  name from province where id=?";
            pst = conn.prepareStatement(sql);
            //设置参数值
            pst.setInt(1,proviceId);
            //执行sql
            rs = pst.executeQuery();
            //遍历rs
            /*while(rs.next()){ //当你的rs中有多余一条记录时。
               name =  rs.getString("name");
            }*/

            if( rs.next()){
                name =rs.getString("name");
            }

        } catch (ClassNotFoundException | SQLException e) {
            e.printStackTrace();
        } finally {
            try{
                if( rs != null){
                    rs.close();
                }
                if( pst != null){
                    pst.close();
                }
                if( conn != null){
                    conn.close();
                }

            }catch(Exception e){
                e.printStackTrace();
            }

        }
        return name;
    }


    //根据id获取一个完整的Province对象
    public Province queryProviceById(Integer proviceId){
        Connection conn = null;
        PreparedStatement pst = null;
        ResultSet rs  = null;
        String sql= "";

        String url="jdbc:mysql://localhost:3306/springdb";
        String username="root";
        String password="123456";

        Province province = null;
        //加载驱动
        try {
            Class.forName("com.mysql.jdbc.Driver");
            conn = DriverManager.getConnection(url,username,password);
            //创建PreparedStatement
            sql="select id, name, jiancheng, shenghui  from province where id=?";
            pst = conn.prepareStatement(sql);
            //设置参数值
            pst.setInt(1,proviceId);
            //执行sql
            rs = pst.executeQuery();
            //遍历rs
            /*while(rs.next()){ //当你的rs中有多余一条记录时。
               name =  rs.getString("name");
            }*/

            if( rs.next()){
                province  = new Province();
                province.setId( rs.getInt("id"));
                province.setName(rs.getString("name"));
                province.setJiancheng(rs.getString("jiancheng"));
                province.setShenghui(rs.getString("shenghui"));
            }

        } catch (ClassNotFoundException | SQLException e) {
            e.printStackTrace();
        } finally {
            try{
                if( rs != null){
                    rs.close();
                }
                if( pst != null){
                    pst.close();
                }
                if( conn != null){
                    conn.close();
                }

            }catch(Exception e){
                e.printStackTrace();
            }

        }
        return province;
    }
}

3、QueryProviceServlet代码

package com.bjpowernode.controller;

import com.bjpowernode.dao.ProvinceDao;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
import java.io.PrintWriter;

public class QueryProviceServlet extends HttpServlet {
    @Override
    protected void doGet(HttpServletRequest req,
                         HttpServletResponse resp) throws ServletException, IOException {
        //处理get请求
        String strProid = req.getParameter("proid");
        System.out.println("strProid:"+ strProid);

        String name = "默认是无数据";
        //访问dao，查询数据库
        if( strProid != null && !"".equals(strProid.trim()) ){
            //创建dao对象，调用它的方法
            ProvinceDao dao  = new ProvinceDao();
            name  = dao.queryProviceNameById( Integer.valueOf(strProid));
        }


        //使用HttpServletResponse输出数据
        // servlet返回给浏览器的是 文本数据， 数据的编码是utf-8
        resp.setContentType("text/html;charset=utf-8");
        PrintWriter pw  = resp.getWriter();
        //pw.println("中国");
        pw.println(name);
        pw.flush();
        pw.close();
    }
}

4、web.xml代码

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee"
         xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_4_0.xsd"
         version="4.0">
    <!--声明servlet-->
    <servlet>
        <servlet-name>QueryProvice</servlet-name>
        <servlet-class>com.bjpowernode.controller.QueryProviceServlet</servlet-class>
    </servlet>
    <servlet-mapping>
        <servlet-name>QueryProvice</servlet-name>
        <url-pattern>/queryProvice</url-pattern>
    </servlet-mapping>

</web-app>

3、笔记

QueryProviceServlet通过extends HttpServlet让其变成Servlet文件，每建立一个Servlet文件需要在web.xml中配置一下。
index.jsp创建异步对象调用open传参到QueryProviceServlet中，QueryProviceServlet得到参数后创建ProvinceDao对象，然后调用它的方法queryProviceNameById（）来驱动ProvinceDao类去建立数据库连接并访问数据库获取相应的值，queryProviceNameById（）方法返回name,QueryProviceServlet得到name后使用HttpServletResponse输出数据，index.jsp通过异步对象的xmlHttp.responseText得到的数据后再去更新dom对象的数据，至此在文本框中完成数据的输出。

这篇关于Ajax---根据id从数据库查找对应的省份名称的文章就介绍到这儿，希望我们推荐的文章对大家有所帮助，也希望大家多多支持为之网！

Java教程

Ajax---根据id从数据库查找对应的省份名称

使用Ajax访问数据库并实现局部更新

1、项目清单

2、代码

1 、index.jsp代码

2、Province代码

3、ProvinceDao类代码

3、QueryProviceServlet代码

4、web.xml代码

3、笔记

前端开发

后端开发

移动端开发

数据库

服务器运维

人工智能

区块链

游戏开发

网站运营

大数据/云计算

软件工程

软件/开发工具使用

资讯