send data from java to javascript using jsp

Question

Totally a newbie for jsp. In my project, I need to send an arraylist / array from java to javascript.

This is my java code in jsp.

<%@ page import="java.util.List" %>
<%@ page import="java.util.ArrayList" %>
<% List<String> strList = new ArrayList<String>();
strList.add("one");
strList.add("two");
strList.add("three"); %>

in my javaScript, I want something like below.

$(document).ready(function() {
    var notes = ["one", "two", "three"];
});

So how do I send the data from java to javascript? Please be specific. Thank you in advance.

solution from Bilal

<%@ page import="java.util.List" %>
<%@ page import="java.util.ArrayList" %>

<html>
    <body>

    <% List<String> strList = new ArrayList<String>();
strList.add("one");
strList.add("two");
strList.add("three"); %>

<script type="text/javascript">

$(document).ready(function() {

    var notes = new Array();
    <%
    for(String note:strList){
    %>
    notes.push('<%=note%>');
    <%}%>
    alert(notes[0]);
});
</script>


</body>

I don't know whether i get your question completely, but just wanted to know that is the java script code is on the same jsp page? and you want you Arraylist values to use in the javascript code correct? — Bilal
– Bilal, Commented Nov 29, 2016 at 2:07
@Bilal Exactly. The answer from Titus does not send the data from java to javascript. — vkosyj
– vkosyj, Commented Nov 29, 2016 at 2:11
Try this one not sure what you mean by sending <% List<String> strList = new ArrayList<String>(); strList.add("one"); strList.add("two"); strList.add("three"); %> <script type="text/javascript"> $(document).ready(function() { var notes = new Array(); <% for(String note:strList){ %> notes.push('<%=note%>'); <%}%> alert(notes); }); </script> — Bilal
– Bilal, Commented Nov 29, 2016 at 2:21
@Bilal StrList cannot be resolved to be a variable. By the way, do you mind if you answer this in the answer session so I could accept your answer. Thank you. — vkosyj
– vkosyj, Commented Nov 29, 2016 at 2:26
can you please share your jsp page so i can understand how you want to run that stuff.I also post a answer with the same code above — Bilal
– Bilal, Commented Nov 29, 2016 at 2:33

Bilal · Accepted Answer · 2016-11-29 02:41:33Z

2

Try this one to use java code in javascript block. I use this code in a jsp page which print the values notes array one,two,three not sure if you are looking for the same thing or something else.

<% List<String> strList = new ArrayList<String>();
    strList.add("one");
    strList.add("two");
    strList.add("three"); %>

    <script type="text/javascript">

    $(document).ready(function() {

        var notes = new Array();
        <%
        for(String note:strList){
        %>
        notes.push('<%=note%>');
        <%}%>
        alert(notes);
    });
    </script>

this is my full jsp page code

<%@page import="java.util.ArrayList"%>
<%@page import="java.util.List"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script
  src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
</head>

<% List<String> strList = new ArrayList<String>();
strList.add("one");
strList.add("two");
strList.add("three"); %>

<script type="text/javascript">

$(document).ready(function() {
    var notes = new Array();
    <%
    for(String note:strList){
    %>
    notes.push('<%=note%>');
    <%}%>
    alert(notes);
});
</script>
<body>

</body>
</html>

edited Nov 29, 2016 at 2:41

answered Nov 29, 2016 at 2:29

Bilal

1281 silver badge8 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

vkosyj Over a year ago

I run it but it does not generate the alert for some reasons.

Bilal Over a year ago

I edited the answer with my full jsp page which i just created for sample don't know whether you want the same stuff, but this code is running on my system and printing the values.

vkosyj Over a year ago

this is very helpful. May I ask one question please? I want to make sure that notes has all the element, I try to traverse the notes array. So i add "for each (var item in notes) {" right before alert() method, but it gives me error, i don't know why it does not let me write js code. Thank you

Bilal Over a year ago

You can try this one for for each loop syntax please see some example on google var arrayLength = notes.length; for (var i = 0; i < arrayLength; i++) { alert(notes[i]); }

Bilal Over a year ago

You can also use Firebug to see what is the error in your js code getfirebug.com

|

Titus · Accepted Answer · 2016-11-29 02:45:33Z

2

On the client side, in the context in which the JavaScript code is executed, the Java code was already compiled, executed and converted to HTML, CSS or JavaScript. What you can do is to create some JavaScript code in your Java code.

<%@ page import="java.util.List" %>
<%@ page import="java.util.ArrayList" %>
<%@page contentType="text/html"%>
<% List<String> strList = new ArrayList<String>();
   strList.add("one");
   strList.add("two");
   strList.add("three"); 
   out.println("<script>");
   out.print("var notes = [");
   boolean first = true;
   for(String str: strList){
       out.print((first?"":",") + "\""+str+"\"");
       first = false;
   }
   out.print("];");
   out.println("alert(notes[0]);");
   out.println("</script>");
%>

The example above will create a new HTML script element which contains the definition and initialization of a JavaScript array which will contain all the Strings from the strList list.

Another solution will be to use AJAX to connect to a jsp page from your JavaScript code to retrieve the data.

edited Nov 29, 2016 at 2:45

answered Nov 29, 2016 at 1:41

Titus

22.6k1 gold badge26 silver badges36 bronze badges

6 Comments

vkosyj Over a year ago

Thank you. I am not sure if I have access to notes now. Right after your code, I use alert(notes[0]), but it does not generate an alert. And how do I really use this to initialize the notes? Thank you.

Scary Wombat Over a year ago

use AJAX to connect to a jsp page from your JavaScript

Titus Over a year ago

@vkosyj I've edited my answer to include a alert(notes[0]) call. What my example does is to generate some HTML code. The out.print(...) and out.println(...) calls are just writing some text in the resulting HTML file that will be generated.

vkosyj Over a year ago

@Titus Thank you for your help. Sorry if i bother you again. My question is that is there a way to actually put the all the elements in the strList in the array in javascript, say, var arr = ["one", "two", "three"]; Also when i run your code, i saw result in the console, how do i see the result in a html? Thank you.

Titus Over a year ago

@vkosyj Oh, I think it doesn't work because the page is not interpreted as a HTML page, you can add this <%@page contentType="text/html";%> to specify the page type.

|

Collectives™ on Stack Overflow

send data from java to javascript using jsp

2 Answers 2

6 Comments

6 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

6 Comments

6 Comments

Your Answer

Sign up or log in

Post as a guest

Related