Sending and recieving data through POST to a java method using jQuery

Question

As a new comer to Java EE and RESTful development, I have a question today. Let me start by adding my code so far.

The HTML and jQuery part:

<form id="frmEmail" action="myurl/">
    <h2>Main page</h2>
    <br>
    <output>Email Address:</output>
    <input type="email" 
           id="email" 
           placeholder="Email Address" 
           name="emailAddress" required autofocus/>
    <br>
    <input type="submit" 
           name="Submit"
           id="btnSub"/>
    <br>
    <br>
    <output id="output"></output>
</form>

<script>
    $(document).ready(function () {
        $("form").submit(function (e) {
            e.preventDefault(e);
            $("#btnSub").val("Loading...");
            $("#btnSub").prop("disabled", true);
            var email = $('#email').val();
            load(email);
        });
    });

    function load(email) {
        $.post("myurl/" + email, function (data) {
        document.getElementById("output").innerHTML = data.message;
        $("#btnSub").val("Submit");
        $("#btnSub").prop("disabled", false);
            });
        };
</script>

My Java class:

@Path("mypath")
public class main {

    @POST
    @Path("{address}")
    @Produces(MediaType.APPLICATION_JSON)
    public Response message(@PathParam("address") String address) {
        emailVerifier verify = new emailVerifier(); // Class that tests an email address
        String status = verify.verifyAddress(address);

        outputResponse response = new outputResponse(); // Just a class with a private String and accessor and mutator methods

        response.setMessage(status);

        if ("Bad Request".equals(status)) {
           return Response.status(Response.Status.BAD_REQUEST).entity(response).build();
        } else {
           return Response.ok().entity(response).build();
        }
    }
}

With that said, my code runs fine and as long as my HTML code is not 400 or up I have no problem but because I use e.preventDefault(e) my code runs into an endless loop, if I can describe it as such as soon as the status BAD_REQUEST is send back.

Is there anyway to fix this or have a work around? Also if you have any other tips or improvements to my current code it would be much appreciated as an intuitive way for me to learn more.

Thanks for any help, it is much appreciated.

Edit: My form also has method="POST"

Was my answer helpful? Then you can accept it and upvote it, by clicking on the check-mark and arrow-up on the left side. If you still have trouble, please provide more info. — code_angel
– code_angel, Commented Dec 23, 2016 at 23:10

code_angel · Accepted Answer · 2016-11-24 20:58:44Z

1

If the issue is in e.preventDefault you can try to do the post submitting by clicking on a normal button, instead of an input type=submit field.

Change

<input type="submit" 
       name="Submit"
       id="btnSub"/>

To

<input type="button" 
       value="Submit"
       id="btnSub"/>

And

 $("form").submit(function (e) {
          e.preventDefault(e);

To

$("#btnSub").click(function () {

answered Nov 24, 2016 at 20:58

code_angel

1,5371 gold badge11 silver badges22 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Sending and recieving data through POST to a java method using jQuery

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related