How to submit a form with jquery-ajax and update input on the form?

How to submit a form with jquery-ajax and update input on the form?

How to submit this form with jquery-ajax and update ? In my servlet I can put some message as request's atribute or mb is better to put this massage to the response? How to update the <p class = "valid-error" with jstl or with success function of ajax?

This is my code:

$(document).ready(function() { $("#mainbutton").click(function() { $("#ajaxform").submit(function(e) { console.log("before"); $.ajax({ url: "userctrl", type: "post", data: $(this).serializeArray(), success: function(data, textStatus, jqXHR) { console.log("success"); $('.valid-error').val("data.message.val()") }, }); }); $("#ajaxform").submit(); //Submit the form console.log("after"); }); });

And my HTML:

<form id="ajaxform"> <input type="text" placeholder="Name" name="name" /> <input type="text" placeholder="Address" name="address" /> <p class="valid-error"> "SOME MESSAGE got with jstl or passed here with the ajax request" </p> <input id="mainbutton" class="mainbutton" type="button" value="trial" /> </form>