Call Servlet and invoke Java code from JavaScript along with parameters

Several ways:

1. Use window.location to fire a GET request. Caveat is that it”s synchronous (so the client will see the current page being changed).

   window.location = "http://example.com/servlet?key=" + encodeURIComponent(key);
   

   Note the importance of built-in encodeURIComponent() function to encode the request parameters before passing it.

2. Use form.submit() to fire a GET or POST request. The caveat is also that it”s synchronous.

   document.formname.key.value = key;
   document.formname.submit();
   

   With

   <form name="formname" action="servlet" method="post">
       <input type="hidden" name="key">
   </form>
   

   Alternatively you can also only set the hidden field of an existing form and just wait until the user submits it.

3. Use XMLHttpRequest#send() to fire an asynchronous request in the background (also known as Ajax). Below example will invoke servlet”s doGet().

   var xhr = new XMLHttpRequest();
   xhr.open("GET", "http://example.com/servlet?key=" + encodeURIComponent(key));
   xhr.send(null);
   

   Below example will invoke servlet”s doPost().

   var xhr = new XMLHttpRequest();
   xhr.open("POST", "http://example.com/servlet");
   xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
   xhr.send("key=" + encodeURIComponent(key));
   

4. Use jQuery to send a crossbrowser compatible Ajax request (above xhr code works in real browsers only, for MSIE compatibility, you”ll need to add some clutter 😉 ).

   $.get("http://example.com/servlet", { "key": key });
   

   $.post("http://example.com/servlet", { "key": key });
   

   Note that jQuery already transparently encodes the request parameters all by itself, so you don”t need encodeURIComponent() here.

Either way, the key will be just available by request.getParameter("key") in the servlet.

See also:

• How to use Servlets and Ajax?
• Access Java / Servlet / JSP / JSTL / EL variables in JavaScript