Access data in external javascript file working with Spring MVC?

StackOverflow https://stackoverflow.com/questions/22480475

Question

I am using spring 3 MVC and i have below classes.

External system would call my application using below URL:

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

I have a spring MVC controller method as below:

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.

externalJs.js

$(document).ready(function() {

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


});

In external java script file, is it possible to get the model content?

Thanks!

Was it helpful?

Solution

In the jsp page you may define global js variable and access those variables from the external js like:

jsp file

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

All server side scripts been rendered at server side and those value will be hardcoded once rendered. Once page loaded in the browser, global variables will be created with the rendered hardcoded value. And my myModel can be access in the external file also.

EDIT: Here is the someJsp.jsp file

<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>

<!DOCTYPE>
<html>
<head>

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


<script src="externalJs.js"></script>

</head>
<body>
<!--content-->
</body>

and externalJs.js

$(document).ready(function() {

// myModel will be accessible from here because it's globally declared
   alert(myModel);

});
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top