JSP Javascript, update java object value

Question

I'm currently trying to get the live value of a Java object in Javascript to fill up some progress bar.

Here is the code in the JSP file :

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<%@ page import="server_ihm_web.server"%>
<!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=ISO-8859-1">
<title>Insert title here</title>
</head>
<style>
#myProgress {
width: 100%;
background-color: #ddd;
}

#myBar1 {
width: 1%;
height: 30px;
background-color: #4CAF50;
}

#myBar2 {
width: 1%;
height: 30px;
background-color: #4CAF50;
}

#myBar3 {
width: 1%;
height: 30px;
background-color: #4CAF50;
}
</style>
<body>

<h1>JavaScript Progress Bar</h1>

<div id="myProgress">
    <div id="myBar1"></div>
</div>
<br>
<div id="myProgress">
    <div id="myBar2"></div>
</div>
<br>
<div id="myProgress">
    <div id="myBar3"></div>
</div>
<%
    server serv = new server();
    serv.startServer();
%>
</body>
<button onclick="move()">Click Me</button>

<script>
function move() {

    var elem = document.getElementById("myBar1");
    var elem2 = document.getElementById("myBar2");
    var elem3 = document.getElementById("myBar3");

    var id = setInterval(update, 100);

    function update() {
        elem.style.width = <%=serv.getBar1()%> + '%';
        elem2.style.width = <%=serv.getBar2()%> + '%';
        elem3.style.width = <%=serv.getBar3()%> + '%';
    }
}
</script>
</html>

serv values are updated every few seconds but nothing changes for the progress bar.

I think it always take the base value of the object so everytime update() is called it will change the progress bar to the same value.

Is there a way to update the values of serv for the javascript ?

Juan · Accepted Answer · 2017-11-28 15:45:54Z

1

I think you are mixing things that live on separate dimensions :)

Javascript executes in the browser and JAVA (JSP) on the server.

If your ideas was to have the jsp scriptlet execute in the user's browser, it is not going to happen.

If you need to update the page with a progress when it is already in the user's browser, you will have to implement some ajax call to get the updates on the background.

answered Nov 28, 2017 at 15:45

Juan

5,6112 gold badges17 silver badges27 bronze badges

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

1 Comment

M. Prokhorov Over a year ago

This question and this same answer comes up so often that I feel we need a well-known question and answer to mark these new ones as a duplicate.

Alejandro Goñi · Accepted Answer · 2017-11-28 15:46:18Z

0

The JSP tags <%= ... %> are evaluated in the server, before the page is displayed the first time in a browser. So, the values of that tags are static, and don't change in each execution of the javascript functions.

For that values to change, you need to do a request to the server, and reload the page. To avoid reloading an entire page each time, you need to do an Ajax request to obtain a new value to display with Javascript.

answered Nov 28, 2017 at 15:46

Alejandro Goñi

5221 gold badge3 silver badges15 bronze badges

Collectives™ on Stack Overflow

JSP Javascript, update java object value

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related