HTML/PHP Form Submission (what to do after)

Caleb Robinson

First question here, so please be patient with me.

I am developing a website for my company. I have an HTML form that uses a php file to email me the data entered by the user. But the user is routed to an ugly .php page with a simple "Thank you" message.

My question has several parts.

  1. Is it standard to have a "Successful Submission" page which looks nice and fancy, or is it fine to just stay on the page the form is on?
  2. If it's fine to stay, how do I execute the php code to send the data without leaving the page?
  3. Further, if I stay on the page, how do I display a message over it saying something like "Thanks, your form was submitted"?
Bivin Damodhar

Considering question 1 Is it standard to have a "Successful Submission" page which looks nice and fancy, or is it fine to just stay on the page the form is on?

It is not mandatory to have a separate page to display response to the end user. Actually it depends on the scenario for which you are developing the page. The main intention is to provide the best UI experience for the end users / visitors of your site. If there is some crucial information with large content, then it is better to show it in another page after form submission. If it is just a success message then it is fine to stay on the same page after form submit and show the response message there.

Now coming to question 2 and 3

If it's fine to stay, how do I execute the php code to send the data without leaving the page?

Further, if I stay on the page, how do I display a message over it saying something like "Thanks, your form was submitted"?

You can accomplish it using ajax. With the help of jquery you can make it much simpler using

$.ajax function

Ex :

$("#formbutton").click(function(){
        $.ajax({
           type: "POST", // method
           url: "savecontact.php", // call to external php file
           data: {name:n,contact:c}, // passing variables to php file

           success: function(result) {

              // get the response after ajax call is successful 
           },
           complete: function(result){

           }
      });
     });

Now in savecontact.php you write the necessary code (usual php code to insert into table) to save the data and return response.

Ex:

result = mysqli_query("INSERT INTO table (NAME ) VALUES ('val')"));
    if($result)
    {
        echo "Success";
        exit;
    }
    else
    {
        echo "Error";
        exit;
    }

After ajax call gets executed, inside success function of ajax call you will get the response either Success or Error and based on that you can display the message into an empty div which normally placed above the form.

success: function (response) {

       if(response == "Success"){
           $("#div").html("Thanks, your form was submitted");          
       }
       else{
            $("#div").html("Issue with form submission.Please try again");
       }
}

The appropriate message will gets display after form submit as ajax response.

Collected from the Internet

Please contact [email protected] to delete if infringement.

edited at
0

Comments

0 comments
Login to comment

Related