I have a list of strings on my server which I am trying to get to the client in the form of an array. The code I am attempting to use is the following:
Within the js
Exp Language:
colArray = ${columns}
The solutions posted above didn't work in my case, I needed an extra Javascript variable to do the transference:
var codesJS=new Array();
<% String[] codes=(String[])request.getAttribute("codes");
if(codes!=null){
for(int i=0; i<codes.length; i++){ %>
var code='<%= codes[i] %>'; //--> without this doesnt work
codesJS[<%= i %>]=code;
<%}
}%>
Try using JSON (Javascript object notation) it'd be quite simple to encode the array and decode it on javascript
check it out here
http://www.json.org/java/index.html
Once the JavaScript reaches the client, the server code has stopped executing. The server code does not execute "in parallel" with the client code.
You have to build the entire JavaScript initialization in Java and send it, complete and executable, to the client:
<%
StringBuffer values = new StringBuffer();
for (int i = 0; i < columns.size(); ++i) {
if (values.length() > 0) {
values.append(',');
}
values.append('"').append(columns.get(i)).append('"');
}
%>
<script type="text/javascript">
var colArray = [ <%= values.toString() %> ];
</script>
That is just one way to do it, you can also build the output "on the fly" by embedding the server code inside the [
and ]
. I used this example to try to demonstrate the separation between building the string that comprises the client-side JavaScript and outputting that to the browser.
You're getting the JSP code that is executed on the server mixed up with the JavaScript code that's executed on the client. The snippet <%=columns.get(j++)%>
is executed once, on the server, and the JavaScript loop around it is irrelevant at this point. When it arrives the the client, the loop's body just says colArray[i] = "first entry";
which of course puts the same string into every element of the array.
What you need to do instead is to have a loop execute on the server, like this:
<% for (int i=0; i<columns.size(); i++) { %>
colArray[<%= i %>] = "<%= columns.get(i) %>";
<% } %>
My JSP skills are rusty, and the syntax may be different, but I hope you get the idea.
Edit: As was pointed out in the comments, you need to be VERY careful about escaping anything in those Strings that could cause them to be interpreted as JavaScript code (most prominently quotation marks) - especially if they contain user-generated content. Otherwise you're leaving your app wide open to Cross-site scripting and Cross-site request forgery attacks.
For me this solution has worked. First of all You should make a JSONArray and use it's toJSONString() method. This method converts the list to JSON text. The result of it is a JSON array.
<%
List<String> exampleList = new ArrayList<>();
exampleList.add("Apple");
exampleList.add("Orange");
exampleList.add("Lemon");
JSONArray fruitList = new JSONArray();
fruitList.addAll(exampleList);
%>
In your JSP page you should invoke the toJSONString() method of the list, and pass the JSON text to a JavaScript array.
<script type="text/javascript"> var fruitArray = <%= fruitList.toJSONString() %>;</script>
(Optionally You could make a simple getter method for the list. In case if you only instantiate the JAVA class - which has the list field - int the JSP page.)