How to write html and JS code in index.scala.html

I’m newbee to Play. From controller sending one json to index.scala.html page I want to write some javascript code which stores that json and it should be displayed in a tabular format. Please suggest how to do this.

Do you mean:

1, Render the JSON along with your index.scala.html? i.e. your controller creates/receives some JSON and then renders index.scala.html? If so, in this case, you can just pass the JSON as a parameter into your template.

2, Your controller to do a server push? i.e. your index.scala.html is already rendered, and your controller wants to push the JSON to it? In this case, maybe https://www.playframework.com/documentation/2.6.x/JavaComet or https://www.playframework.com/documentation/2.6.x/JavaWebSockets

3, Or, you mean to use “old school” AJAX, where the index.scala.html is rendered and you want to make an async call to your controller to get some additional JSON data? In this case, it is pretty standard way to have some javascript (either as part of your template, or as a separate js file), and use AJAX, like jQuery or some other lib.

Like @chrono_b mentioned, you can print JSON directly on index.scala.html. You should be careful with XSS, and you can use base64 encoding to avoid XSS.

Here’s a working example: https://github.com/GIVESocialMovement/sbt-vuefy/blob/master/test-play-project/app/views/index.scala.html (it’s an example how to use Vue with Play, but it shows how to send data from controller to JS.)