1

私は jquery で ajax を使用しており、私の ajax URL は、フォーム データをデータベースに送信する別の jsp ページを呼び出しています。同じページをリロードして送信ボタンをクリックすると、データベースに送信されます。問題はポストバックメソッドのようなものだと思います。私はajaxが初めてなので、助けが必要です...

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

2 に答える 2

3

あなたの 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")てパラメータ値を取得します

更新: 行データの末尾にコンマ (,) がありませんでした:....

更新 2 : これは、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%>

最初の画面には次のように表示されます。

ここに画像の説明を入力

データを挿入してsaveボタンを押すと、次のように表示されます。

ここに画像の説明を入力

于 2013-07-22T09:59:26.500 に答える
1

申し訳ありませんが、これを回答として投稿しませんが、アカウントにコメントとして投稿する権限がないため、投稿する必要がありますが、クリックするものを混乱させると確信しています。は実際のボタンではありませんが、どちらも機能します#call。問題の原因がそこにあると思われるため、コードを確認できるように element div投稿していただけますか。test.jsp

あなたはあなたの質問を編集したと思うので、私の答えは無駄だと思います。

于 2013-07-22T08:48:30.993 に答える