Search code examples
javascriptjspspring-mvcmodelattribute

How to read model attribute from js outside jsp

If my javascript/jquery code is written inside a jsp-file, I can refer to Spring's modelAttribute value with "${varName}".

However I would like to move the javascript code into it's own file to keep the jsp-file more readable. When I do that, it won't however be able to find that modelAttribute anymore. How should I solve this problem?

How can I point to model attribute from a .js -file?

Thanks in advance!

Solution

  • Alright, I've experimented on my end to try to find and answer for this question.

    Actually, it seems there's no direct solution, and here's why:

    1. When you are moving your Javascript code to a separate file, this means that the browser will launch a separate request to fetch that file. As such, data that you store in your request scope (a.k.a. ${varName}) is not part of the request that fetches the .js file; it's only part of the request that fetches your .jsp file instead. As such, the ${varName} value will not be available in your Javascript file.

    2. Another reason on top of the above: .js files are not processed as server-side code by the web engine (most likely Tomcat in this case), so the ${varName} text is outright ignored. For fun, I tried to do a hack: I renamed my script file from .js to .jsp, and used this within my .jsp page:

      <script type="text/javascript" src="js/actually_javascript.jsp"></script>

      It fooled the web server to process the file server-side, but this still didn't work, because of reason #1 stated above. It could work if you stored the value in the session instead, but at the end of the day, it would be kind of an ugly hack and you'd lose out on the code highlighting and completion features of your IDE, which would be fooled into thinking you're editing an actual .jsp file. Not recommended.

    To conclude, I think the only way to access {$varName} inside your JavaScript is either:

    • Having the Javascript being a part of your .jsp file, within <script> tags
    • Having your Javascript in its own .js file, but still having a <script> tag in your .jsp page which initializes the module you programmed in the .js file and passes the values from the request, like ${varName}