web-dev-qa-db-ja.com

javascriptファイルでSpring MVCモデルオブジェクトにアクセスする方法は?

Spring 3 MVCを使用していますが、以下のクラスがあります。

外部システムは、以下のURLを使用してアプリケーションを呼び出します。

http://somehost/root/param1/param2/param3

私は次のようなスプリングMVCコントローラーメソッドを持っています:

public ModelAndView showPage(@PathVariable("param1") String paramOne, @PathVariable("param2") String paramTwo, @PathVariable("param3") String paramThree, HttpServletResponse response) {  
        SomeModel model = new SomeModel(paramOne, paramTwo, paramThree);
       return new ModelAndView("SomeJsp", "model", model);
    } 

SomeModel.Java

public class SomeModel{
 private String paramOne;
 private String paramTwo;
 private String paramThree;
//constructor
 //setters and getters

}

SomeJsp.jsp

//In this Jsp i have a div with few elements. Div is not visible by default.
//This jsp has externalJavascript included.
//I enable div and set the data into div elements using jquery.
<script src="<c:url value="/resources/js/extjs.js" />" type="text/javascript"></script>

externalJs.js

$(document).ready(function() {

    //Here i need the model returned using ModelAndView
//I can get data from model and set into div elements.


});

外部Javaスクリプトファイルで、モデルコンテンツを取得することは可能ですか?可能であれば、どのようにすればよいですか?

ありがとう!

14
user755806

JavaScriptはクライアント側で実行されます。モデルはクライアント側には存在せず、.jspのレンダリング中にサーバー側にのみ存在します。

モデルのデータをクライアント側のコード(javascriptなど)で使用できるようにする場合は、レンダリングされたページのどこかに保存する必要があります。たとえば、Jspを使用して、モデルをJavaScript変数に割り当てるJavaScriptを記述することができます。

更新:

簡単な例

<%-- SomeJsp.jsp --%>
<script>var paramOne =<c:out value="${paramOne}"/></script>
28
Aurand

別のソリューションは、JSPで使用できます:_<input type="hidden" id="jsonBom" value='${jsonBom}'/>_

jQueryを使用してJavascriptで値を取得します。

var jsonBom = $('#jsonBom').val();

16

私は最近、同じニーズに直面しました。オーランドの方法を試しましたが、コードに$ {}が欠けているようです。したがって、SomeJsp.jsp <head></head>is内のコードは次のとおりです。

<script>
  var model=[];
  model.paramOne="${model.paramOne}";
  model.paramTwo="${model.paramTwo}";
  model.paramThree="${model.paramThree}";
</script>

Var model = ${model}を使用して割り当てることはできないことに注意してください。Javaオブジェクト参照。

$(document).ready(function() {
   alert(model.paramOne);
});
8
Splash

この方法は機能し、この構造を使用すると、独自のフレームワークを作成し、より少ない定型でそれを行うことができます。

何らかのエラーが存在する場合は申し訳ありませんが、私はこれを携帯電話で手軽に書いています

Maven依存関係:

<dependency>
    <groupId>com.google.code.gson</groupId>
    <artifactId>gson</artifactId>
    <version>1.7.1</version>
</dependency>

Java:

Person.Java(Person Object Class)

Class Person {

    private String name;

    public String getName() {
        return this.name;
    }

    public void setName(String name) {
        this.name = name;
    }

}

PersonController.Java(Person Controller)

@RestController
public class PersonController implements Controller {

    @RequestMapping("/person")
    public ModelAndView handleRequest(HttpServletRequest arg0, HttpServletResponse arg1) throws Exception {
        Person person = new Person();
        person.setName("Person's name");
        Gson gson = new Gson();

        ModelAndView modelAndView = new ModelAndView("person");
        modelAndView.addObject("person", gson.toJson(person));

        return modelAndView;
    }
}

表示:

person.jsp

<html>
    <head>
        <title>Person Example</title>
        <script src="jquery-1.11.3.min.js"></script>
        <script type="text/javascript" src="personScript.js"></script>
    </head>
    <body>
        <h1>Person/h1>
        <input type="hidden" id="person" value="${person}">     
    </body>
</html>

Javascript:

personScript.js

function parseJSON(data) {
    return window.JSON && window.JSON.parse ? window.JSON.parse( data ) : (new Function("return " + data))(); 
}

$(document).ready(function() {
    var personJson = $('#person');
    person = parseJSON(personJson.val());
    alert(person.name);
});
7
Juan Furattini

以下は、JavaScriptでリストオブジェクトを使用可能にした例です。

var listForJavascript = [];
<c:forEach items="${MyListFromJava}" var="listItem">
  var arr = [];

  arr.Push("<c:out value="${listItem.param1}" />");
  arr.Push("<c:out value="${listItem.param2}" />");

  listForJavascript.Push(arr);
</c:forEach>
5
tObi

クライアント側にオブジェクトがないため、JavaScriptからJavaオブジェクトにアクセスできません。プレーンHTMLページのみを受け取ります(隠しフィールドが役立つ場合がありますが、あまり良いアプローチではありません)。

Ajaxと@ResponseBodyを使用することをお勧めします。

1
Patison

コントローラー内:

JSONObject jsonobject=new JSONObject();
jsonobject.put("error","Invalid username");
response.getWriter().write(jsonobject.toString());

javaScriptで:

f(data!=success){



 var errorMessage=jQuery.parseJson(data);
  alert(errorMessage.error);
}
0
bharath sc