0
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ page import="java.net.*" %>
<%@ page import="java.io.*" %>    
<%@ page import="java.util.*" %>
<%@ page import="java.sql.*" %>
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $("input").change(function(){
        var p1 = $('#password1').val();
        var p2 = $('#password2').val();
        var p3 = $('#password3').val();
        var p4 = $('#password4').val();

        $.post('http://localhost../mycode.jsp',
        {
            pass1 : p1,
            pass2 : p2,
            pass3 : p3,
            pass4 : p4,
        },
        function(data,status){
            console.log(data)
            alert("Status : "+ status);
        });
    });
});
</script>
</head>
<body>
<%
String pw1,pw2,pw3,pw4;
pw1 = "1";
pw2 = "2";
pw3 = "3";
pw4 = "4";
out.println("<div id='password' style=' display: block; position: absolute; left: 30%;'>");
out.println("<h1 style=' position: absolute; top: -120%; left: 18%; font-family: Titillium Web;'>PASSWORD</h1>");
out.println("<form method='POST'>");
out.println("&nbsp;&nbsp;&nbsp;&nbsp; <input type='number' id='password1' maxlength='1' max='9' style=' width: 1%; padding: 12px 12px; margin: 8px 0px; border: none; border-bottom: 2px solid red;'>");
out.println("&nbsp;&nbsp;&nbsp;&nbsp; <input type='number' id='password2' maxlength='1' max='9' style=' width: 1%; padding: 12px 12px; margin: 8px 0px; border: none; border-bottom: 2px solid red;'>");
out.println("&nbsp;&nbsp;&nbsp;&nbsp; <input type='number' id='password3' maxlength='1' max='9' style=' width: 1%; padding: 12px 12px; margin: 8px 0px; border: none; border-bottom: 2px solid red;'>");
out.println("&nbsp;&nbsp;&nbsp;&nbsp; <input type='number' id='password4' maxlength='1' max='9' style=' width: 1%; padding: 12px 12px; margin: 8px 0px; border: none; border-bottom: 2px solid red;'>");
out.println("</form>");
out.println("</div>");

String ele1 = request.getParameter("pass1");
String ele2 = request.getParameter("pass2");
String ele3 = request.getParameter("pass3");
String ele4 = request.getParameter("pass4");

if((pw1.equals(ele1)) && (pw2.equals(ele2)) &&(pw3.equals(ele3)) && (pw4.equals(ele4)))
     out.println("Code Successful!!");
else
    out.println("Code Failed.");
%>
</body>
</html>

This is the basic code of what I am working with. I want to perform an action after the user form data is sent asynchronously to the server and server performs tasks. How do I update those if condition values whose value is set at runtime by the user.

D.Kat
  • 33
  • 7

1 Answers1

1

I want to perform an action after the user form data is sent asynchronously to the server and server performs tasks.

Assuming we are sticking to Jquery ajax, anything you want to do in response to an async request has to be done via callback function.

In other words:

$.post('http://localhost../mycode.jsp',
// ... other arguments to ajax call
function(data,status){
// do stuff that requires waiting on async request HERE
});

Thats the only place where you know the request has completed with whatever status.

You can move the if logic into there or another one suggestion is to wrap up the logic you want executed into another smaller function. And then call that from inside the $.post callback.

uncleoptimus
  • 360
  • 2
  • 8
  • So, I would have to pass the parameters pw1,pw2... to the callback function? – D.Kat Apr 06 '18 at 03:11
  • How do I pass the values of pw's to the ajax function? – D.Kat Apr 06 '18 at 08:31
  • Well, by the looks of the code you shared, those variables are in-scope of the ajax callback function. So in that case you could just reference them in the function body. If somehow they are not, you should be able to use a closure to get them in scope of the callback. – uncleoptimus Apr 06 '18 at 23:51
  • I am talking about the variables pw1, pw2, etc which are being generated on the server side in the tag and are needed to be sent to the ajax callback function. I am guessing I need to send it back as response to the success function but I am not sure How to send it from jsp and receive it in ajax. – D.Kat Apr 07 '18 at 02:37
  • Ah, I had totally missed the JSP reference. My bad. Out of my wheelhouse, but it looks like by default jsp returns html to write to page? Out of curiosity I found some references that mite help w/ sending data to a callback: [how to return data to ajax from servlet](https://stackoverflow.com/questions/18479477/how-to-return-data-to-ajax-from-java-servlet) and [how to use servlets and ajax](https://stackoverflow.com/a/4113258/2415751) – uncleoptimus Apr 07 '18 at 23:04