如何处理jQuery的Ajax和JSP数据库更新？如何处理、数据库、Ajax、jQuery

2023-09-10 18:10:44 作者：别跟劳资拽「你还不够格」

我已经使用Ajax和jQuery和我的AJAX的网址是调用另一个JSP页面，该页面提交表单数据到数据库中的问题是，每当我跑插入查询，其回答空值不能被插入到数据库还挺例外，但每当我重新加载同一个页面，然后点击提交按钮，它得到提交到数据库中。我认为这个问题是像回传方法，我是新来的ajax所以请需要你的帮助......

 ＆LT; HTML＆GT;
＆LT; HEAD＆GT;
＆LT;脚本类型=文/ JavaScript的SRC =http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js＆GT;＆LT; / SCRIPT＆GT;
＆LT;脚本类型=文/ JavaScript的＆GT;
    $（文件）。就绪（函数（）{
        $（'＃保存）。点击（函数（）
        {
            $阿贾克斯（{
                类型：后，
                网址：test.jsp的，//这是我的servlet
                数据：输入=+ $（'＃身份证'）VAL（）+＆放大器;输出=+ $（'＃运）VAL（）
                成功：函数（MSG）{
                        $（'＃输出）追加（MSG）;
                }
            }）;
        }）;

    }）;
＆LT; / SCRIPT＆GT;
＆LT; META HTTP-当量=Content-Type的CONTENT =text / html的;字符集= UTF-8＆GT;
＆LT;冠军＆GT; JSP页面＆LT; /标题＆GT;
＆LT; /头＆GT;
＆LT;身体GT;
    输入：＆LT;输入ID =id类型=文本名称=值=/＆GT;＆LT; BR＆GT;＆LT; / BR＆GT;
    输出：其中，输入ID =OP类型=文本名称=值=/＆GT;＆LT; BR＆GT;＆LT; / BR＆GT;
    ＆LT;输入类型=按钮值=保存NAME =保存ID =保存/＆GT;
   ＆LT; DIV ID =输出＆GT;＆LT; / DIV＆GT;
＆LT; /身体GT;

JSP：

 ＆LT;％@页面进口=com.connectionUtil.ConnectionUtil％＆GT;
＆LT;！DOCTYPE HTML＆GT;
＆LT;脚本SRC =JS / jquery.min.js类型=文/ JavaScript的＆GT;＆LT; / SCRIPT＆GT;
＆LT;％字符串ID =的request.getParameter（输入）;
    尝试 {
        连接CON = ConnectionUtil.getConnection（）;
        字符串SQL =插入测试（ID，...）VALUES（'+编号+'，...）;
        preparedStatement PS = CON prepareStatement（SQL）。
        ps.executeUpdate（）;
    }赶上（SQE的SQLException）{
        通过out.println（SQE）;
    }％GT;
＆LT;身体GT; ＆LT; H4＆GT;＆LT;％= ID％＆GT;存储＆LT; / H4＆GT; ＆LT; /身体GT; ＆LT; / HTML＆GT;

解决方案 jsp使用jquery ajax 请求返回json数据不成功

您阿贾克斯code是错误的。它应该是这样的：

  $。阿贾克斯（{
  类型：后，
  网址：test.jsp的，//这是我的servlet
  数据：{输入：$（'＃身份证'）VAL（），输出：$（'＃运）VAL（）}，
  成功：函数（MSG）{
      $（'＃输出）追加（MSG）;
  }
}）;

然后用的request.getParameter（输入）来获取参数值

更新：请注意，我错过了一个逗号（，）在该行数据的末尾：......

更新2 ：这是你的code没有连接到数据库工作演示......

index.jsp的：

 ＆LT;％@页面的contentType =text / html的的pageEncoding =UTF-8％＆GT;
＆LT; HTML＆GT;
＆LT; HEAD＆GT;
＆LT;脚本类型=文/ JavaScript的SRC =http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js＆GT;＆LT; / SCRIPT＆GT;
＆LT;脚本类型=文/ JavaScript的＆GT;
    $（文件）。就绪（函数（）{
        $（'＃保存）。点击（函数（）
        {
            $阿贾克斯（{
                类型：后，
                网址：test.jsp的，//这是我的servlet
                数据： {
                    输入：$（'＃身份证'）VAL（）。
                    输出：$（'＃运）VAL（）。
                }，
                成功：函数（MSG）{
                        $（'＃输出）追加（MSG）;
                }
            }）;
        }）;

    }）;
＆LT; / SCRIPT＆GT;
＆LT; META HTTP-当量=Content-Type的CONTENT =text / html的;字符集= UTF-8＆GT;
＆LT;冠军＆GT; JSP页面＆LT; /标题＆GT;
＆LT; /头＆GT;
＆LT;身体GT;
    输入：＆LT;输入ID =id类型=文本名称=值=/＆GT;＆LT; BR＆GT;＆LT; / BR＆GT;
    输出：其中，输入ID =OP类型=文本名称=值=/＆GT;＆LT; BR＆GT;＆LT; / BR＆GT;
    ＆LT;输入类型=按钮值=保存NAME =保存ID =保存/＆GT;
   ＆LT; DIV ID =输出＆GT;＆LT; / DIV＆GT;
＆LT; /身体GT;

test.jsp的：

 ＆LT;％@页面的contentType =text / html的的pageEncoding =UTF-8％＆GT;
＆LT;％字符串ID =的request.getParameter（输入）;
字符串输出=的request.getParameter（输出）;
％＆GT;
＆LT;％= ID％＆GT;存储＆LT; BR /＆GT;输出为：其中，％=输出％＆GT;

第一个屏幕显示的：

和插入数据后pressing 保存按钮，就说明这一点：

I have used ajax with jquery and my ajax url is calling another jsp page which submits form data to database the problem is whenever I'm running the insert query, its replying "Null values can't be inserted to database" kinda exception, but whenever I'm reloading same page and clicking submit button, its getting submitted to database. I think the problem is with something like postback method, I'm new to ajax so please need your help...

<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script type="text/javascript">
    $(document).ready(function() {
        $('#save').click(function ()
        {
            $.ajax({
                type: "post",
                url: "test.jsp", //this is my servlet
                data: "input=" +$('#id').val()+"&output="+$('#op').val(),
                success: function(msg){      
                        $('#output').append(msg);
                }
            });
        });

    });
</script>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>JSP Page</title>
</head>
<body>
    input:<input id="id" type="text" name="" value="" /><br></br>
    output:<input id="op" type="text" name="" value="" /><br></br>
    <input type="button" value="save" name="save" id="save"/>
   <div id="output"></div>
</body>

JSP:

<%@page import ="com.connectionUtil.ConnectionUtil"%> 
<!DOCTYPE html> 
<script src="js/jquery.min.js" type="text/javascript"></script> 
<% String id = request.getParameter("input");
    try {
        Connection con = ConnectionUtil.getConnection();
        String sql = "insert into test(ID,...) values ('" + id + "',...)";
        PreparedStatement ps = con.prepareStatement(sql);
        ps.executeUpdate();
    } catch (SQLException sqe) {
        out.println(sqe);
    }%> 
<body> <h4><%=id%> is stored </h4> </body> </html>

解决方案

Your ajax code is wrong. It should be like this:

$.ajax({
  type: "post",
  url: "test.jsp", //this is my servlet
  data: {input : $('#id').val(), output: $('#op').val()},
  success: function(msg){      
      $('#output').append(msg);
  }
});

And then use the request.getParameter("input") to get the parameter value

UPDATE : Please note that i missed a comma (,) at the end of the line data:....

UPDATE 2 : This is a working demo of your code without the connections to db...

index.jsp:

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script type="text/javascript">
    $(document).ready(function() {
        $('#save').click(function ()
        {
            $.ajax({
                type: "post",
                url: "test.jsp", //this is my servlet
                data: {
                    input: $('#id').val(), 
                    output: $('#op').val()
                },
                success: function(msg){      
                        $('#output').append(msg);
                }
            });
        });

    });
</script>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>JSP Page</title>
</head>
<body>
    input:<input id="id" type="text" name="" value="" /><br></br>
    output:<input id="op" type="text" name="" value="" /><br></br>
    <input type="button" value="save" name="save" id="save"/>
   <div id="output"></div>
</body>

test.jsp :

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<% String id = request.getParameter("input");
String output = request.getParameter("output");
%> 
<%=id%> is stored <br/>output is:<%=output%>

The first screen shows this:

And after inserting data and pressing save button it shows this: