Call servlet without submit and stay in same JSP page

Question

I am new to java web programming. So, here what I have done, I have built a decorator model and I have a servletthat invokes methods of different classes of the model.

In the JSP file I have a menu of items and quantity list for every item. The quantity is presented as a <List> </List>

What I need to do is that whenever the quantity is changed, call doPost which calls the decorate classes to recalculate the price and update the price in the same JPS page

I tried to use <select id="id1" name="id1" onchange="document.menu.submit()", the doPostis being called but I'm being forwarded to blank page!!! which is the servlet page. I want to update the price and stay in the same JSP page

So, basically I need to call servlet doPost or another function in servlet and return the price to the same JSP page

This is a snapshot of one item from JSP

<select id="id1" name="id1" onchange="document.menu.submit()">
<option value="0"> 0</option>
<option value="1"> 1</option>
<option value="2"> 2</option>
<option value="3"> 3</option>
<option value="4"> 4</option>
<option value="5"> 5</option>
</select> 
<td> <input type="text" name="totalTxtbox" id="totalTxtbox" style="width:40px;"/> </td>

From servlet

private Model model;
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        PrintWriter out = response.getWriter();
        int id1=Integer.parseInt(request.getParameter("id1"));
        double total;
        total= calculatePrice(id1, id2, id3, id4, id4); // This method handles the price calculation 
        request.setAttribute("totalTxtbox", total);

    }

Sorry if it is trivial problem!

No, but I will check it. Thank you – SHADOW.NET Nov 22 '16 at 08:27 — SHADOW.NET, Nov 22 '16 at 08:27

Jay · Answer 1 · 2016-11-22T09:53:54.223

You can make an Asynchronous Call to your servlet.

AJAX is an acronym for Asynchronous JavaScript and XML. It is a group of inter-related technologies like JavaScript, DOM, XML, HTML, CSS etc. AJAX allows you to send and receive data asynchronously without reloading the web page. So it is fast.

AJAX allows you to send only important information to the server not the entire page. So only valuable data from the client side is routed to the server side. It makes your application interactive and faster.

All you would need is some JavaScript.

For example, the URL of the servlet you want to send data to is servlet.ajx and you want to send two variables userId and itemId, then you can write this in your JSP Page.

<head>
    <!-- ... -->
    <script src="path/to/jquery.js" type="text/javascript"></script>
    <script>
        function doSubmit() {
            $.ajax({
                type: 'POST',
                url: 'servlet.ajx',
                data: 'userId=' + userid + '&itemId=' + itemId,
                error: function(response) {
                    // Gets called when an error occurs with error details in variable response
                },
                success: function(response) {
                    // Gets called when the action is successful with server response in variable response
                }
            });
        }
    </script>
</head>

Thank you but I need more precise answer. I have never used AJAX — SHADOW.NET, Nov 22 '16 at 08:26

score 0 · Answer 2 · answered Nov 22 '16 at 06:10

0

Please refer below link which is providing the same example: http://www.journaldev.com/4742/jquery-ajax-jsp-servlet-java-example

answered Nov 22 '16 at 06:10

mayank agrawal

628
5
20

1

If this link goes dead your answer will become meaningless. – Scary Wombat Nov 22 '16 at 06:14

Dinks · Answer 3 · 2016-11-22T07:32:33.443

There's not an quick and easy way for you to post back to the server and have it simply update the total field. As far as I know, these are the 3 most popular ways to get what you need accomplished:

JSP - Expression Language (EL) - This requires that you refresh the page and, while doing so, fill in the fields with what the user typed. To do that, you capture all of the input data and put it into the JSP page on its way back via Request or Session attribute.
AJAX - AJAX can update portions of the HTML page with server data without refreshing the entire page.
JavaScript - Most often these days, data edits are done on the client side with JavaScript. In your case, this may make the most sense if you have the data you need already on the page. It may be as easy as a one or two line JavaScript function (Say for example, calcTotals) that is called via changing your submit to: onchange="calcTotals();" I'm no JavaScript expert but, if that's all you're attempting to do, I'd try that first.

I thought about (1), but it is not a good approach to reload the page with every change. (2) I need to read about Ajax ( never used it). (3) I have read that it is not possible to call servlet method from javascript — SHADOW.NET, Nov 22 '16 at 08:23

Call servlet without submit and stay in same JSP page

3 Answers3