CODEWITHSUNDEEP
javascriptjqueryhtmltemplatesplayframework
deepapple
deepapple

Reputation: 21

How to access an HTML template argument passed from controller in a Javascript function

My app is using the play framework mvc setup. In the controller I am passing a parameter while rendering the template, like this:

public static void scenario(){
     ...
     render(active_brands);  
}

Now in my HTML page "scenario.html", I can access the parameter using the play framework tags like this:

#{list items:active_brands, as:'c'}
...
#{\list}

Or using JQuery inside an HTML table like this:

<td>${active_brands.get(1)}</td>

Just for reference, the passed in parameter is a List.

However, I am trying to access the parameter "active_brands" from a javascript function and I am not sure how to do that. I thought using Jquery to access the variable would work and I tried to access the variable like this:

function update_brands(active_scenario_ids){
    ...
    alert('Reached: '+ ${active_brands});
}

but that does not work. It seems to me that the HTML attribute is out of scope for the javascript function. Is that true? It would be great if someone can help me with this. Thanks.

Upvotes: 2

Views: 2022

Answers (2)

deepapple
deepapple

Reputation: 21

The root of the problem was that my template variable, which is accessible in client side HTML, was of type java.util.List, which is not accessible by client side code ie. javascript. However, it is recognized in the play tags because play tags are server side code written in client side. So the only solution I could find for reading Objects inside java collections is returning a JSON object.

Therefore I had to change my code such that instead of returning a Java List as a template variable, I retrieve the data as a JSON object through an ajax call.

$.ajax({
            url: '/getBrands/',
            type: 'POST',
            data: {active_scenario_ids: active_scenario_ids},
            dataType: "json",

            success: function(data){
                console.log(data);
            },
            error: function(req, status, error){
                alert("R:"+req+"S:"+status+"E:"+error);
            }
        });
    }

Upvotes: 0

dbau
dbau

Reputation: 16329

This works for me using Play 2.2.0:

Application.scala (controller):

  def index = Action { implicit request =>

   val message = "This is a test."

   Ok(views.html.test(message))

  }

test.scala.html (view template):

@(message: String)

<script type="text/javascript">
$(document).ready(function(){

console.log("@message");

});

</script>

Console output:

This is a test.

Upvotes: 1

Related Questions