In Ajax->submit how to find the submission was success

Question

I have a view that contains a hidden <div>. I show the hidden <div>, and when I click on submit in the hidden <div>, I want to know the whether the result is a success or failure.

In case of failure the <div> must not hide. Right now, it is always hidden.

Answer 1

Sample code:

var element = document.getElementById(element_id);
        element.innerHTML = '<p><em>Loading ...</em></p>';
        xmlhttp.open("GET", fragment_url);
        xmlhttp.onreadystatechange = function() {
            if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                element.innerHTML = xmlhttp.responseText;
            }
        }
        xmlhttp.send(null);

xmlhttp.readyState change when your Ajax request is processed and the server responds. xmlhttp.status gives you the return code from the server xmlhttp.responseText gives you the response from the server - you can use this to ascertain whether your business logic is a success or a failure (send some error msg and check for it here)

Answer 2

@Cherian & @Pradeep failed to mention that you should intercept the onsubmit handler for your form. This handler should do the AJAX style form submission and prevent the default submission by returning 'false'.

<form action="submissionurl" method="post" onsubmit="formHandler(); return false;">
  ...
</form>

I'd also recommend the use of jquery, as it simplifies your code by a huge amountsubmit