CODEWITHSUNDEEP
javajavascripthtmljspservlets
user550413
user550413

Reputation: 4819

Change DIV tag content dynamically with JSP code

I'll describe how the thing works now and then what I wish to achieve:

I've got a basic HTML page which has a textbox and a Send button. When I type some string and click the button this request gets to a Servlet. The servlet does something and then redirects the req&resp to a jsp file (getServletContext().getRequestDispatcher("myJSP.jsp").forward(req, resp);)

So basically, when someone types something in the textbox and clicks on the Send button he gets a new page which was generated by the myJSP.jsp file.

Is there any way that instead getting a complete new file I want the result that the myJSP.jsp generates to be shown in the same main page, let's say under the textbox (in a DIV tag?).

How can I achieve such a behavior?

Upvotes: 0

Views: 6132

Answers (2)

Narayan Subedi
Narayan Subedi

Reputation: 1343

try doing jquery $.ajax() function, first download jquery.js and keep it to your project folder and locate it. follow as below:

<head>
 <script src="../resources/jquery.js"></script> <script src="../resources/jquery.js"></script>
</head>

<body>
   <input type="text"><input class="button" type="button" value="Click">
<div></div>
<script>
    $(".button").click(function () {
        $.ajax({
              url: "ajax.html",
              cache: false
            }).done(function( html ) {
              $("div").append(html);
            });
        });
</script>
</body>

Upvotes: 1

micha
micha

Reputation: 49572

You have to do an asynchronous request with javascript so that the page does not reload for the user. The server has to return a response you can then append to the page with javascript.

This technique is called ajax. A popular tool (besides tons of other ways) for doing ajax requests is the ajax() function of the JQuery javascript library (documentation)

Upvotes: 2

Related Questions