当前位置: 首页 > 图文教程 > 网络编程 > JSP > AJAX 自学练习 无刷新提交并修改数据库数据并显示

JSP
Servlet及JSP中的多线程同步问题
使用Ant和Tomcat创建Web应用
如何直接在浏览器内运行SQL命令
Servlet、Jsp中的多国语言显示
html与jsp开发分离技术
通过Jsp发送动态图像
Servlets和JSP Pages最佳实践
学习在JSP中使用JavaBeans
JSP显示内容缓存技巧
应用JDOM处理数据库到XML转换的JSP实现
JSP中tomcat的SQL Server2000数据库连接池的配置
用JSTL实现JSP应用程序快速开发
浅谈4种类型的JDBC驱动程序
怎样设置 JSP 的虚拟目录
Java 中对文件的读写操作之比较
javamail在jsp中调用
jsp中任意文字转Unicode的通用模块
JSP与SQL SERVER的留言本
jspSmartUpload上传下载全攻略
Tomcat5.x中的虚拟主机配置方法

JSP 中的 AJAX 自学练习 无刷新提交并修改数据库数据并显示


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-10-11   浏览: 85 ::
收藏到网摘: n/a

对应在数据库中表格 rocars表的msg_id,ccrn两个字段。现在要实现在界面上修改ccrn的值,ajax提交到response.jsp页面,并调用RocarsEntiy.updateCcrn方法更新对应的ccrn,最后无刷新显示 request.jsp页面中有rocarsId,和ccrn两个text。
对应在数据库中表格 rocars表的msg_id,ccrn两个字段。现在要实现在界面上修改ccrn的值,ajax提交到response.jsp页面,并调用RocarsEntiy.updateCcrn方法更新对应的ccrn,最后无刷新显示
代码:
request.jsp
复制代码 代码如下:

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script language="javascript"><!--
function GetXmlHttpObject(){
var xmlHttp = null;
try{
xmlHttp = new XMLHttpRequest();
}catch(e){
try{
xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
}catch(e){
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
}
return xmlHttp;
}
function updateCcrn(rocarsId,ccrn){
alert(rocarsId)
alert(ccrn)
xmlHttp = GetXmlHttpObject();
if(xmlHttp == null){
alert ("you browser don't support the ajax");
return;
}
var url = "./response.jsp";
url = url + "?rocarsId="+ rocarsId;
url = url + "&ccrn="+ ccrn;
url = url + "&sid ="+ Math.random();
xmlHttp.onreadystatechange = stateChanged;
xmlHttp.open("GET", url, true);
xmlHttp.send(null);
}
function getCcrn(str){
xmlHttp = GetXmlHttpObject();
if(xmlHttp == null){
alert ("you browser don't support the ajax");
return;
}
var url = "./response.jsp";
url = url + "?q="+ str;
url = url + "&sid ="+ Math.random();
xmlHttp.onreadystatechange = stateChanged;
xmlHttp.open("GET", url, true);
xmlHttp.send(null);
}
function stateChanged()
{
if(xmlHttp.readyState==4)
{
document.getElementById("rocarsccrn").value = xmlHttp.responseText;
}
}
// --></script>
</head>
<body>
<form name="form1" action="" method="post">
<label>rocarsId:</label><input type="text" name="rocarsId" value="140" />
<label>ccrn:</label><input type="text" id="rocarsccrn" name="rocarsccrn" onchange="updateCcrn(document.form1.rocarsId.value,this.value)"/>
</form>
</body>
</html>

response.jsp
复制代码 代码如下:

<%@ page language="java" contentType="text/plain; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ page import="com.lwf.eus.util.*,java.util.*,com.lwf.eus.entity.*,com.lwf.eus.bean.*" %>
<%
String rocarsId = request.getParameter("rocarsId");
String ccrn = request.getParameter("ccrn");
System.out.println("rocarsId:" + rocarsId);
System.out.println("ccrn:" + ccrn);
RocarsEntity.updateCcrnById(rocarsId,ccrn);
out.print(ccrn);
%>

RocarsEntity.java
复制代码 代码如下:

package com.lwf.eus.entity;
import java.sql.Connection;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.sql.Statement;
import java.util.Vector;
import com.lwf.eus.bean.RocarsBean;
import com.lwf.eus.util.ConnectionManager;
public class RocarsEntity {
public static Vector getRocarsList() {
Vector vRocars = new Vector();
//Connection conn = ConnectionManager.getConnection();
Connection conn = ConnectionManager.getConnectionFromDS();
Statement st = ConnectionManager.createStatement(conn);
String sql = "select msg_id,ccrn from rocars";
ResultSet rs = null;
try {
rs = st.executeQuery(sql);
while (rs.next()) {
RocarsBean rocars = new RocarsBean();
rocars.setRocarsId(rs.getString(1));
rocars.setCcrn(rs.getString(2));
vRocars.addElement(rocars);
}
} catch (SQLException e) {
e.printStackTrace();
} finally {
try {
if (rs != null) {
rs.close();
}
} catch (SQLException e) {
e.printStackTrace();
}
try {
if (st != null) {
st.close();
}
} catch (SQLException e) {
e.printStackTrace();
}
try {
if (conn != null) {
conn.close();
}
} catch (SQLException e) {
e.printStackTrace();
}
return vRocars;
}
}
public static RocarsBean getRocarsListById(String rocarsId){
Connection conn = ConnectionManager.getConnectionFromDS();
Statement st = ConnectionManager.createStatement(conn);
String sql = "select * from rocars where msg_id=" + rocarsId;
ResultSet rs = null;
RocarsBean rocars= null;
try {
rs = st.executeQuery(sql);
rocars = new RocarsBean();
while (rs.next()) {
rocars.setRocarsId(rs.getString("msg_id"));
rocars.setCcrn(rs.getString("ccrn"));
}
} catch (SQLException e) {
e.printStackTrace();
} finally {
try {
if (rs != null) {
rs.close();
}
} catch (SQLException e) {
e.printStackTrace();
}
try {
if (st != null) {
st.close();
}
} catch (SQLException e) {
e.printStackTrace();
}
try {
if (conn != null) {
conn.close();
}
} catch (SQLException e) {
e.printStackTrace();
}
return rocars;
}
}
public static void updateCcrnById(String rocarsId, String ccrn)
{
Connection conn = null;
Statement stmt = null;
try {
conn = ConnectionManager.getConnectionFromDS();
stmt = ConnectionManager.createStatement(conn);
String sqlStr = "update rocars set ccrn= '"+ ccrn + "'" + "where msg_id=" + rocarsId ;
stmt.executeUpdate(sqlStr);
} catch (SQLException e) {
// TODO Auto-generated catch block
e.printStackTrace();
} finally{
try {
if (stmt != null) {
stmt.close();
}
} catch (SQLException e) {
e.printStackTrace();
}
try {
if (conn != null) {
conn.close();
}
} catch (SQLException e) {
e.printStackTrace();
}
}
}
}

ConnectionManager.java
这里可以直接使用JDBC也可以调用weblogic的数据源JNDI。
复制代码 代码如下:

package com.lwf.eus.util;
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.SQLException;
import java.sql.Statement;
import javax.naming.Context;
import javax.naming.InitialContext;
import javax.naming.NamingException;
import javax.sql.DataSource;
public class ConnectionManager {
public static Connection getConnection(){
Connection conn = null;
String url = "jdbc:postgresql://192.168.0.180/getseus";
String userName = "getsdbadmin";
String pwd = "powerdb";
try {
Class.forName("org.postgresql.Driver").newInstance();
conn = DriverManager.getConnection(url,userName,pwd);
} catch (SQLException e) {
e.printStackTrace();
} catch (ClassNotFoundException e) {
e.printStackTrace();
} catch (InstantiationException e) {
e.printStackTrace();
} catch (IllegalAccessException e) {
e.printStackTrace();
} catch (Exception e){
e.printStackTrace();
}
return conn;
}
public static Connection getConnectionFromDS(){
Connection conn = null;
Context ctx = null;
try {
ctx = new InitialContext();
DataSource ds = (DataSource)ctx.lookup("JNDIPG");
conn = ds.getConnection();
} catch (NamingException e) {
// TODO Auto-generated catch block
e.printStackTrace();
} catch (SQLException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
return conn;
}
public static Statement createStatement(Connection conn){
Statement st = null;
try {
st = conn.createStatement();
} catch (SQLException e) {
e.printStackTrace();
}
return st;
}
}