Page Refresh & Pop Up Success Message After Submit

Question

I wonder whether someone may be able to help me please

Firstly, my apologies as this may be a very simple problem to the more seasoned developer, but this is my first website I'm building so please bear with me.

For my site I have a number of forms which all fit around a template I've created. Most forms require the user to click a submit button which then calls a PHP script to save the data into a MySQL database.

An example of code that I use to do this, is as follows:

<form id="addfinds" name="addfinds" method="post" action="savefinds.php">

When the form has been submitted, a line in my addfinds.php script then echoes either Find saved or There was a problem .

I'm working separately on some form validation to cleanse the data before submission, but what I'd like to be able to do is rather than the message being echoed from the PHP script, I'd like a pop up message to appear on screen in it's place, and if the submission is successful for the fields to clear and the page refresh.

I've done quite a bit of reading on this, and I'm a little unsure on how to progress this. I just wondered whether someone, perhaps with a greater experience than I could offer some guidance please or point me in the direction of a good tutorial.

Answer 1

function FUNCTIONNAME() {
    $.ajax({
        type: "POST",
        url: "YOUR METHOD NAME WHICH IS CALLED",
        data: "{PARAMETER VALUES TO BE PASSED}",
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        complete: function () {
        },
        success: function (msg) {                    
           alert("YOUR SUCCESS MESSAGE HERE");
        },
        error: function (msg) {
            alert("Error " + msg.d.toString());
        }
    });
}