I'm looking to pass a servlet variable, myVar that is passed into a JSP page, and pass it to JavaScript. The JavaScript is an external javascript that is included into the JSP page.

I have a button that calls the JavaScript function, but I'm unable to pass any of the variables that are passed into the JSP page through the servlet. The button is not a part of a form.

I've tried in a function in JavaScript to call:

var x = '<%=myVar%>';

AND

var x = '${myVar}';

AND

var x = '<%= (String)request.getParameter("myVar") %>';

However, x is always a string of what I inputted.

I'm not using AJAX or JQuery. Any ideas?

Example Code is a simplified version: (so the button is actually a drop down that calls the js when I change the value, however, I want other variables that are not part of the drop down to be called in changeCLass)

Servlet side:

request.setAttribute("otherVars","tests");

JSP:

<script type="text/javascript" src="external.js"></script>

<select name="vars" id="myVars" onchange="changeClass(this)">
<option value='1' selected="selected">1</option>
</select>

external.js included in JSP:

function changeClass(newVarX) {

    var newVarId =newVarX.value;
    var tID = '${otherVars}';

    alert(newVarId + " " + tID);
}

Output: 1 $(otherVars}

but output should be: 1 tests

I'm looking to pass a servlet variable, myVar that is passed into a JSP page, and pass it to JavaScript. The JavaScript is an external javascript that is included into the JSP page.

I have a button that calls the JavaScript function, but I'm unable to pass any of the variables that are passed into the JSP page through the servlet. The button is not a part of a form.

I've tried in a function in JavaScript to call:

var x = '<%=myVar%>';

AND

var x = '${myVar}';

AND

var x = '<%= (String)request.getParameter("myVar") %>';

However, x is always a string of what I inputted.

I'm not using AJAX or JQuery. Any ideas?

Example Code is a simplified version: (so the button is actually a drop down that calls the js when I change the value, however, I want other variables that are not part of the drop down to be called in changeCLass)

Servlet side:

request.setAttribute("otherVars","tests");

JSP:

<script type="text/javascript" src="external.js"></script>

<select name="vars" id="myVars" onchange="changeClass(this)">
<option value='1' selected="selected">1</option>
</select>

external.js included in JSP:

function changeClass(newVarX) {

    var newVarId =newVarX.value;
    var tID = '${otherVars}';

    alert(newVarId + " " + tID);
}

Output: 1 $(otherVars}

but output should be: 1 tests

• javascript
• jsp
• variables
• servlets

• is this code taken from the external file? – rano Commented Nov 4, 2012 at 19:32
• @user1798546 simple way of doing it is creating a hidden field that stores the value and getting it from there. Another way is to pass the variable into the js function as a parameter <button onclick='someFunction(<%= (String)request.getParameter("myVar") %>)'> Call function</button> – Lyuben Todorov Commented Nov 4, 2012 at 19:36
• It would be better to explain how your application behaves atm (with code sample) to have a better understanding and provide a better solution – Luiggi Mendoza Commented Nov 4, 2012 at 21:01
• "The JavaScript is an external javascript that is included into the JSP page" - could you post the JSP showing how you include this file? – Martin Wilson Commented Nov 4, 2012 at 21:22
• BTW ${otherVars} won't work on its own- you'll need to use c:out or a similar tag eg <c:out value="${otherVars}"/> – Martin Wilson Commented Nov 4, 2012 at 21:28

1 Answer 1

This does not work, because your JavaScript file is not processed by the server. Possible solutions are:

• Declare the variable tID globally in the JSP file.

  JSP:

  <script type="text/javascript" src="external.js"></script>
  <script type="text/javascript">
      var tID = '${otherVars}';
  </script>
  
  <select name="vars" id="myVars" onchange="changeClass(this)">
      <option value='1' selected="selected">1</option>
  </select>
  

  JavaScript (external.js):

  function changeClass(newVarX) {
      var newVarId = newVarX.value;
      alert(newVarId + " " + tID);
  }
  

• Have the JavaScript file also be processed. You may use a JSP file for the JavaScript and apply the correct content type:

  JSP:

  <script type="text/javascript" src="external.jsp"></script>
  
  <select name="vars" id="myVars" onchange="changeClass(this)">
      <option value='1' selected="selected">1</option>
  </select>
  

  JavaScript (external.jsp --> note, that it's a JSP file, too, but the content type is set to text/javascript):

  <%@ page language="java" contentType="text/javascript; charset=UTF-8" pageEncoding="UTF-8"%>
  function changeClass(newVarX) {
      var newVarId = newVarX.value;
      var tID = '${otherVars}';
      alert(newVarId + " " + tID);
  }