如何處理jquery ajax與數據庫更新的jsp？

我用jQuery的ajax和我的Ajax網址調用另一個jsp頁面提交表單數據到數據庫問題是每當我運行插入查詢，它的答覆「空值不能插入到數據庫」有點例外，但每當我重新加載相同的頁面並點擊提交按鈕，它就會被提交到數據庫。我認爲這個問題是像回傳方法，我是新來的阿賈克斯所以請需要你的幫助......如何處理jquery ajax與數據庫更新的jsp？

<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>

來源

2013-07-22 kAmol

帶'id ='call''的元素在哪裏？ – anu

@anu對不起，我編輯了它.. – kAmol

檢查控制檯這個ajax調用及其響應。它會給你更多關於這個問題的想法 – anu

你的ajax代碼是錯誤的。它應該是這樣的：

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

然後使用request.getParameter("input")來獲取參數值

UPDATE：請注意，我錯過了在該行數據的末尾逗號（，）:. ...

更新2：這是你的代碼沒有連接數據庫的工作演示...

的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%>

初始屏幕顯示這一點：

enter image description here

和插入數據和按壓按鈕save後它顯示這樣的：

enter image description here

來源

2013-07-22 09:59:26 MaVRoSCy

值是當訪問加載頁面並提交和另一件事是我編輯的代碼，如你所說，但沒有變化的輸出.. 。 – kAmol

你是否設法讓它工作？ – MaVRoSCy

** Thanx MaVRoSCy ... ** 您的更新代碼正在工作。再次感謝。 – kAmol

對不起，我不會張貼此作爲答案，但我必須這樣做，因爲我沒有權利在我的帳戶中將其作爲評論發佈，但我確信您會混淆點擊的內容。 #call指elementdiv不是實際的按鈕，但它也可以。您能否請您發佈您的test.jsp，以便我們可以看到代碼，因爲我懷疑是否會導致此問題。

我想你已經編輯了你的問題，所以我認爲我的回答是浪費。

來源

2013-07-22 08:48:30 HTTP

'code' <％@ page import =「com.connectionUtil.ConnectionUtil」％> <！DOCTYPE html> <％ String id = request.getParameter（「input」）; ... 嘗試連接con = ConnectionUtil.getConnection（）; String sql =「insert into test（ID，...）values（'」+ id +「'，...）」; PreparedStatement ps = con.prepareStatement（sql）; ps。的executeUpdate（）; catch（SQLException sqe）{ out.println（sqe）; } ％>

<%=id%>存儲

– kAmol

如何處理jquery ajax與數據庫更新的jsp？

回答

<%=id%>存儲

相關問題