質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

ただいまの
回答率

90.50%

  • Java

    13803questions

    Javaは、1995年にサン・マイクロシステムズが開発したプログラミング言語です。表記法はC言語に似ていますが、既存のプログラミング言語の短所を踏まえていちから設計されており、最初からオブジェクト指向性を備えてデザインされています。セキュリティ面が強力であることや、ネットワーク環境での利用に向いていることが特徴です。Javaで作られたソフトウェアは基本的にいかなるプラットフォームでも作動します。

  • jQuery

    6715questions

    jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

  • JSON

    1155questions

    JSON(JavaScript Object Notation)は軽量なデータ記述言語の1つである。構文はJavaScriptをベースとしていますが、JavaScriptに限定されたものではなく、様々なソフトウェアやプログラミング言語間におけるデータの受け渡しが行えるように設計されています。

  • JSP

    932questions

    JSP(Java Server Pages)とは、ウェブアプリケーションの表示レイヤーに使われるサーバーサイドの技術のことです。

  • servlet

    470questions

    Servletとは、Webページの動的な生成やデータ処理などをサーバ上で実行するために、Javaで作成されたプログラムです。 ショッピングサイトやオンラインバンキングといった、動的なウェブサイトの構築に用いられています。

w2uiのグリッドを使用してデータを表示させたい

解決済

回答 2

投稿

  • 評価
  • クリップ 0
  • VIEW 2,386

jess2pg

score 7

実現したいこと

w2uiというグリッドを使用しているのですが、サーブレットからJSPにデータを渡してグリッドにデータを表示したいです。
処理概要は「画面A → サーブレット(JSON作成) → 画面B(w2uiのグリッド)」です。
json-libで作成したJSONオブジェクトを、サーブレット側でどのように記述したら画面Bのグリッドにデータを表示出来るのでしょうか。

表示させたいデータ

{
    "status" : "success",
    "total" : 2,
    "records" : [
        {
            "recid" : 1,
            "a" : "hoge_1_1",
            "b" : "hoge_1_2",
            "c" : "hoge_1_3"
        },
        {
            "recid" : 2,
            "a" : "hoge_2_1",
            "b" : "hoge_2_2",
            "c" : "hoge_2_3"
         }
    ]
};

グリッドの記述

$(function(){
    $('#grid').w2grid({
        name:'grid',
        show:{toolbar:true,footer:true},
        url:{
            get:'./hogehoge',
        },
        dataType:'JSON',
        contentType : "application/json",
        multiSearch:true,
        searches:[
            {field:'recid', caption:'ID', size:'50px', type:'int'},
            {field:'a', caption:'a', size:'30%', type:'text'},
            {field:'b', caption:'b', size:'30%', type:'text'},
            {field:'c', caption:'c', size:'30%', type:'text'}
        ],
        columns:[
            {field:'recid', caption:'ID', size:'50px', sortable:true, resizable:true},
            {field:'a', caption:'a', size:'500px', sortable:true, resizable:true,
                render: function (record) {
                    return "<a href='./hogehoge2'>" + record.a + "</a>";
                }
            },
            {field:'b', caption:'b', size:'70px', sortable:true, resizable:true, editable:{type:'text'}},
            {field:'c', caption:'c', size:'130px', sortable:true, resizable:true, editable:{type:'text'}}
        ]
    });
});
//PrintWriter out = response.getWriter();
JSONObject json = new JSONObject();

//out.print(json);これだとJSONのデータが表示されるだけ。
request.setAttribute("jsonData", json);//データは渡せているけどグリッドに表示されない。

//画面は表示出来るが、グリッドに表示されない。
//画面を表示してグリッドにデータを表示するには、どのようにしたらよいでしょうか。
RequestDispatcher dispatcher = request.getRequestDispatcher("/a/b/c.jsp");
dispatcher.forward(request, response);

試したこと

w2uiのサンプルにあった「records:」や「url:/a/b.json」でデータを表示出来るところまでは確認しています。
requestでデータを受け取ることが出来たので、「onLoad:」で表示させてみようとしたのですが、1行追加するごとに空行が挿入されました。

  • 気になる質問をクリップする

    クリップした質問は、後からいつでもマイページで確認できます。

    またクリップした質問に回答があった際、通知やメールを受け取ることができます。

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

回答 2

check解決した方法

0

java側で以下のようにしたところ、表示されるようになりました。

response.setContentType("application/json; charset=UTF-8");
PrintWriter out = response.getWriter();

// JSONデータの作成
JSONObject json = new JSONObject();

out.print(json);

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

0

Grid Overview のページの Example 2 に書いてあるように url にリソースを指定しておくと、Grid が url に指定されたリソースを非同期要求するので、サーバーで要求を受けたら所定の形式の JSON 文字列を応答として返すようにしておけば、後は表示まで全部 Grid が面倒見てくれます。

Grid Overview
http://w2ui.com/web/docs/1.5/grid

url に指定するリソースは、同じドメインにあって(AJAX なのでドメインが異なるのは NG)指定された形式の JSON 文字列を返すことができれば、.aspx ページ、HTTP ハンドラ、Web サービス、WPF、MVC のアクションメソッド、Web API などを使用できます。

具体的な実装例は、ASP.NET の HTTP ハンドラですが(すみません、Java は書けないですん)、以下の記事が参考にならないでしょうか?

w2ui Grid
http://surferonwww.info/BlogEngine/post/2015/12/26/w2ui-grid-in-aspnet-web-forms-application.aspx

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2017/02/06 19:26

    ご回答ありがとうございます。
    >サーバーで要求を受けたら所定の形式の JSON 文字列を応答として返すようにしておけば
    の部分と、教えて下さったURLは既に見ていまして、これをJavaでどう実装したら良いものかと考えております。

    キャンセル

  • 2017/02/06 19:49

    それなら紹介した記事の HTTP ハンドラを Java でs実装するにはどうしたらいいかというような質問にした方がよかったかもしれませんね。自分は Java はわからないのでお役に立てずすみません。

    キャンセル

15分調べてもわからないことは、teratailで質問しよう!

  • ただいまの回答率 90.50%
  • 質問をまとめることで、思考を整理して素早く解決
  • テンプレート機能で、簡単に質問をまとめられる

関連した質問

同じタグがついた質問を見る

  • Java

    13803questions

    Javaは、1995年にサン・マイクロシステムズが開発したプログラミング言語です。表記法はC言語に似ていますが、既存のプログラミング言語の短所を踏まえていちから設計されており、最初からオブジェクト指向性を備えてデザインされています。セキュリティ面が強力であることや、ネットワーク環境での利用に向いていることが特徴です。Javaで作られたソフトウェアは基本的にいかなるプラットフォームでも作動します。

  • jQuery

    6715questions

    jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

  • JSON

    1155questions

    JSON(JavaScript Object Notation)は軽量なデータ記述言語の1つである。構文はJavaScriptをベースとしていますが、JavaScriptに限定されたものではなく、様々なソフトウェアやプログラミング言語間におけるデータの受け渡しが行えるように設計されています。

  • JSP

    932questions

    JSP(Java Server Pages)とは、ウェブアプリケーションの表示レイヤーに使われるサーバーサイドの技術のことです。

  • servlet

    470questions

    Servletとは、Webページの動的な生成やデータ処理などをサーバ上で実行するために、Javaで作成されたプログラムです。 ショッピングサイトやオンラインバンキングといった、動的なウェブサイトの構築に用いられています。