Javaに関する様々な情報をご紹介します。

Javaに関する様々な情報をご紹介します。
評価

0

ajaxでjspの中の部分更新

ajaxでjspの中の部分更新をしたいです。
フレームワークは使ってないです。純粋なServlet/Jspでやってます。

テキストボックスに入力されている値をサーバ側にajax通信で送信して、
サーバ側で受信した値を加工してjsp側に返して、加工後の値をjspに表示する。

ネットの記事を見てサーバ側で返した値はjspに出力できたのですが、ネットの記事
(http://www.atmarkit.co.jp/ait/articles/0602/11/news012_3.html)では
PrintWriter out = response.getWriter();
out.println("Hello, world!");
のようにPrintWriterを使う例しか見つかりません。

私がやりたいのは、以下のような自前のクラスのオブジェクトを返して、
リストの内容を表示したいです。
public class User {
    List<String> list = new ArrayList<String>();
    ...略...
}

サーバ側から任意のクラスオブジェクトを返したい場合の、
サーバ側での書き方がわかりません。

参考になるサイトがあれば、URLを教えて頂くだけでも助かります。
よろしくお願いします。

8

回答

10386

閲覧

8件の回答

評価

0

根本的に理解が足りていない気がするな。
サーバからクライアントに返すことができるのは、単一の文字列だけだ。
Ajaxのクライアント側はJavaScriptであり、JavaScriptはそもそもJavaのオブジェクトを知らない。

通常、何がしかの約束に従った文字列をやり取りすることで、擬似的に論理構造を返している。
例えばA、B、Cという3つの文字列が入ったListを返したい。Listというオブジェクトは前述した通り返せないが、A以下は文字列なのだから、これを何とか1つにすれば「単一の文字列」になる。
まず考えられるのは"A,B,C"という簡易CSVにすることだ。JavaScript側でこの文字列をカンマでsplitしてArrayにすれば、3つの文字列が入ったListと同等のものができる。
この場合カンマを含めることはできないので、カンマが必要なら別の(使われない)区切り文字にするか、より複雑な約束事にする。

そもそもAjaxが何の略だかは理解しているだろうか?

評価

0

回答ありがとうございます!

Ajaxとはを調べ直しました。
Asynchronous JavaScript + XML(非同期通信でデータを取得したり、動的にウェブページを書換えること
とありました。


単一の文字列しか返せないについてですが、言われてみれば、サンプルなどを見ると全部そうなってますね。。
・何番目は何の値かルールを決めるか、
・id:XXX,name:XXXのように項目名の値を取り出せるように書き方ルールを決めるか
のどちらかが必要ということで理解しました。


その点を踏まえて、お聞きしたいです。

http://blog.codebook-10000.com/entry/20130930/1380507089
このサイトのサンプルを自分の環境でやってみたところ、
表示されていたテキストフィールドなどがなくなって、
サーバ側から返した文字列だけが表示されてしまいました。

期待する動きとしては、表示されていたテキストフィールドなどはそのまま表示されて、
テキストフィールドに返ってきた値が入る。と思ったらそうはならなかったです。

サーバ側の処理で
PrintWriter out = response.getWriter();
out.println("Hello, world!");
をやっているから、上書きして消えてしまっているのでしょうか。
別の実装方法で値を返すようにすれば、テキストフィールドなどは消えないのでしょうか?
それともjsp側の書き方が悪い・・・?

以上、よろしくお願い致します。

評価

0

>とありました。
実際にXMLを使っている例はそう多くないと思うが、XMLという単一の文字列への「約束事」がキモだ。

>このサイトのサンプル
本当にサンプルそのまんまなのか…?

>をやっているから、上書きして消えてしまっているのでしょうか。
関係ない。
Ajaxには確かにクライアントとサーバの両方が必要だが、AjaxをAjaxたらしめるのはJavaScriptであって、サーブレットやjspではない。
サーバ側をどんな言語のどんなフレームワークで作っても、同一の文字列ならJavaScriptは同一の動きをする。
つまりJavaの話ではなくなり、この掲示板で扱う話題ではなくなる。

サーブレットやjspはいったん忘れて、JavaScriptから見てAjaxとはどのようなものかを、様々な解説やサンプルで、じっくり理解しよう。

評価

0

お世話になっております。
「参考サイトにのっている内容を自分の環境でやってみる」を再度行いました。
すると、画面(テキストフィールド)などはそのまま表示されるのですが、
ajax自体がエラー(NotFound)でServletに処理が届かない状態になってしまいます。
jsp内のurlの部分を怪しんだり、そもそもjqueryが読み込めているかなども確認しましたが、
解決には至りませんでした。

長くなって申し訳ありませんが、ソースを記載します。
何かおかしい点があったら、ご教授願いたいです。よろしくお願いします。


/*********************************************
 * ajaxtest.jsp
 ********************************************/
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JSON TEST</title>
<script type="text/javascript" src="${pageContext.request.contextPath}/lib/jquery-2.1.4.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/lib/jquery.json-2.4.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/lib/uchida.js"></script>
<!-- <script type="text/javascript" src="js/test.js" charset="utf-8"></script>-->
<script type="text/javascript">
function test(){
    uchida();
}
$(function() {
    var requestObj = {
        message : null,
    };
    $("#request").click(function() {
        requestObj.message = $("#message").val();
        var requestJson = $.toJSON(requestObj);

        alert(requestJson);
        test();
        koshin();

        $.ajax({
            type: "POST",
            url : "TestServlet",
            data: {requestJs : requestJson},
            success : function(data) {
                $("#result").append(data.responseMessage);
            },
            error : function(XMLHttpRequest, textStatus, errorThrown) {
                $("#result").append("リクエスト時になんらかのエラーが発生しました:" + textStatus +":\n" + errorThrown);
            }
        });

    });
});
</script>
</head>
<body>
<p>サーブレットへのリクエストに投げるメッセージを入力してください。aa:</p>
<input type="text" size="30" id="message">
<input type="button" id="request" value="送信する">
<%= request.getContextPath() %>
<%= request.getContextPath()+"/lib/uchida.js" %>
<input type="button" onclick="uchida()" value="uchida" />
<input type="button" onclick="test()" value="test" />
<div id="result">
<p>結果:</p>
</div>
</body>
</html>

/*********************************************
 * TestServlet.java
 ********************************************/
package main;
import 省略
public class TestServlet extends HttpServlet {
    private final String REQUEST_STRING = "requestJs";
    public void doGet(HttpServletRequest req, HttpServletResponse res) throws ServletException, IOException {
        String parameter = req.getParameter(REQUEST_STRING);
        System.out.println(parameter);

        String responseJson = "{\"responseMessage\" : \"サーブレットからの返信です\"}";
        res.setContentType("application/json;charset=UTF-8");
        PrintWriter out = res.getWriter();
        out.print(responseJson);
    }
}

/*********************************************
 * web.xml
 ********************************************/
ヘッダー・フッター省略
  <servlet>
    <servlet-name>TestServlet</servlet-name>
    <servlet-class>main.TestServlet</servlet-class>
  </servlet>
  <servlet-mapping>
    <servlet-name>TestServlet</servlet-name>
    <url-pattern>/TestServlet</url-pattern>
  </servlet-mapping>

評価

0

先に書いたとおり、Javascriptはこの携示板で扱う内容ではない。
場所を変える方がいい。
その際は、やったことをより細かく伝えること。
肝心のuchida.jsも提示すること。
そして何より、ソースを載せるなら「そのまま動くもの」を提示すること。
こういうのは、質問する場合の基本だ。

評価

0

javaのサーバサイドやっていたら知っていて損はない内容なのに、見てる人で、あーそんなのあるんだっていうきっかけになる人もいるかもしれないのに。

積極的に学ぼうとしているのに、止めなくても・・と思ってしまいますが、私が間違ってるんですかね。場所違いで、失礼しました。

「Javaの質問」が思いつくことがあったら、また来ます。
ありがとうございました。

評価

0

誤)url: 'TestServlet',
正)url: '/Pain/TestServlet',
これでいけました!正直バッチリ理解はしてませんが。。
ご回答頂いた方、ありがとうございます!

評価

0

「関係がある」という基準では、ちょっとでもJava が関わっていれば何でもかんでも対象になってしまう(「ちょっと」の基準が人によって全然違うのは容易に想像が付く)。

そして…「場所を変えろ」が「質問を止めろ」という意味だと感じられたんだろうか?(確かに、「ここでは」質問を止めろということだが)

質問から6ヶ月以上経過しているので、回答を書き込むことはできません。