Pass a GET parameter to a JavaScript function?

Question

I have this code

<%=out.write("<input 
  type=\"hidden\" 
  id=\"tid\" 
  value=\""+request.getParameter("id").toString()+"
\"/>")%>
<script type="text/javascript">
  getPage(document.getElementById("tid").value)
</script>

This code creates a hidden field with the value came from

<site root>/viewPage.jsp?id=erwdf

url and pass the value of this hidden field to a jsp function. When I ran this code on Tomcat it gave an error as

The method print(boolean) in the type JspWriter is not applicable for the arguments (void)

on JSP code line I given above. So am I doing anything wrong or is there any alternative method to pass a GET parameter to a JavaScript function? I don't know much about Javascript just started to learn it.

Solution 1

Why so overcomplicated with a hidden field?

Just do

getPage('<%=request.getParameter("id")%>');

Or easier, with EL

getPage('${param.id}');

You may only want to escape special JS characters by Apache Commons Lang StringEscapeUtils, otherwise the generated JS code may break whenever the parameter value contains a single quote or any other special JS character.

getPage('<%=StringEscapeUtils.escapeJavaScript(request.getParameter("id"))%>');

Or when in EL

getPage('${util:escapeJS(param.id)}');

See also:

• How to escape JavaScript in JSP?

Solution 2

I believe you meant <%out.write instead of <%=out.write

about the other issue from the comments, this will assist with getPage and perform escaping of quotes, other special chars...

<script type="text/javascript">
  getPage("<% try {
      out.write(URLEncoder.encode(request.getParameter("id").toString(), "UTF-8"));
    } catch (Exception e) {
    } %>")
</script>

Solution 3

You don't have to store it in a hidden field to access it from js. You can read it from the documents location. I personally use a method like this to grab GET parameters from my url.

function getUrlVars() {
    var vars = [], hash;
    var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
    for (var i = 0; i < hashes.length; i++) {
        hash = hashes[i].split('=');
        vars.push(hash[0]);
        vars[hash[0]] = hash[1];
    }
    return vars;
}

var id = getUrlVars()['id'];

Comments

[BalusC]

Why so overcomplicated with a hidden field? Why not just getPage('<%=request.getParameter("id")%>')?

[Aishwarya Shiva]

thanks @BalusC that was amazing. Actually I don't have much experience in JavaScript. Now its giving value as getPage('adsd'); so are single quoted data are treated as strings in JavaScript?

[BalusC]

Yes, otherwise it's treated as a global variable, but you don't have any JS variable with that name.

[Aishwarya Shiva]

Thanks @Sir Troll your code is not giving error but when I passed getUrlVars()['id'] in my function getPage() its not executing getPage()

[Aishwarya Shiva]

ya it worked thanks @dldnh but again my Javascript function getPage is not executing

[dldnh]

instead of putting the value into an <input> and using document.getElementById you should just pass it directly to getPage -- getPage("<% out.write(request.getParameter("id").toString()); %>") -- probably need some escaping, too, inside the quotes

[Aishwarya Shiva]

don't u think it will pass the whole "<% out.write(request.getParameter("id").toString()); %>" to getPage()?? I only want to pass the id value to getPage()

[dldnh]

it will pass whatever's written by out.write -- I've edited my answer to show what I mean about the encoding, since you could have non-friendly characters in your request parameter that could corrupt the call to getPage.

[Aishwarya Shiva]

Thanks @BalusC nice one. I will give it a try after understanding the post you linked and let you know.