Refresh Page after Success Message

CcoconghaileApr 22, 2022

I'm using your form to send data to a database. It works perfectly. Then I have another page that I can update the data from the database. I'm able to retrieve the data, change it and press submit. When I do, the data changes in the database, the success message comes up but the form stays the same until I manually press refresh, then I can see the changes in the form.

Can I ask....in your PHP code, where could I add the header("Location: https://mywebsite.ie/page.html?id=$id&action=formupdated"); to make the page refresh automatically after successful submit to show the refreshed page with the changes.

My PHP code below;

connect_error);
     
      // Check connection
      if ($conn->connect_error) {
        die("Connection failed: " . $conn->connect_error);
      }    
     return $conn;
  }
  $conn = Connect();
    
  // Form Processing Messages
  $message_success = 'Successfully updated. Thank you!';
  
  if( $_SERVER['REQUEST_METHOD'] == 'POST' ) {
  	if( $_POST['template-contactform-id'] != '' ) {
  
      $id = $_POST['template-contactform-id'];
  
      $firstname = $conn -> real_escape_string($_POST['template-contactform-firstname']);
      $surname = $conn -> real_escape_string($_POST['template-contactform-surname']);
      $email = $_POST['template-contactform-email'];  
      $phone = $_POST['template-contactform-phone'];
      
      $address = $conn -> real_escape_string($_POST['template-contactform-address']);  
      $county = $_POST['template-contactform-county'];
      $code = $_POST['template-contactform-code'];
      $country = $_POST['template-contactform-country'];
      
      $address_EN = $conn -> real_escape_string($_POST['template-contactform-address-EN']);  
      $county_EN = $_POST['template-contactform-county-EN'];
      $country_EN = $_POST['template-contactform-country-EN'];
      
      $qualification = $conn -> real_escape_string($_POST['template-contactform-qualification']);
      $experience = $conn -> real_escape_string($_POST['template-contactform-experience']);
      
      $qualification_EN = $conn -> real_escape_string($_POST['template-contactform-qualification-EN']);
      $experience_EN = $conn -> real_escape_string($_POST['template-contactform-experience-EN']);
      
      $nameOne = $conn -> real_escape_string($_POST['template-contactform-name-test-one']);
      $emailOne = $_POST['template-contactform-email-test-one'];
      $phoneOne = $_POST['template-contactform-phone-test-one'];
      
      $nameTwo = $conn -> real_escape_string($_POST['template-contactform-name-test-two']);
      $emailTwo = $_POST['template-contactform-email-test-two'];
      $phoneTwo = $_POST['template-contactform-phone-test-two'];
      
      $interestOne_EN = $conn -> real_escape_string($_POST['template-contactform-interest-1-EN']);
      $interestTwo_EN = $conn -> real_escape_string($_POST['template-contactform-interest-2-EN']);
      $interestThree_EN = $conn -> real_escape_string($_POST['template-contactform-interest-3-EN']);
      $interestFour_EN = $conn -> real_escape_string($_POST['template-contactform-interest-4-EN']);
      $interestFive_EN = $conn -> real_escape_string($_POST['template-contactform-interest-5-EN']);
      
      $checkboxOne = $_POST['template-contactform-time'];  
      $checkboxTwo = $_POST['template-contactform-gaeilge'];
      $checkboxThree = $_POST['template-contactform-contactApprove'];  
      $checkboxFour = $_POST['template-contactform-approveOne'];  
      $checkboxFive = $_POST['template-contactform-approveOneReference'];   
      $checkboxSix = $_POST['template-contactform-approveTwo'];
      $checkboxSeven = $_POST['template-contactform-approveTwoReference'];  
      $checkboxEigth = $_POST['template-contactform-approved'];
      
      $updateDate = date('Y/m/d H:i:s');
      
      $sql = "UPDATE database_table 
              SET firstname = '$firstname',
              surname = '$surname',
              email = '$email',
              phone = '$phone',
              address = '$address',
              county = '$county',
              code = '$code',
              country = '$country',
              address_EN = '$address_EN',
              county_EN = '$county_EN',
              country_EN = '$country_EN',
              qualification = '$qualification',
              experience = '$experience',
              qualification_EN = '$qualification_EN',
              experience_EN = '$experience_EN',
              name_test_one = '$nameOne',
              email_test_one = '$emailOne',
              phone_test_one = '$phoneOne',
              name_test_two = '$nameTwo',
              email_test_two = '$emailTwo',
              phone_test_two = '$phoneTwo',          
              interest_1_EN = '$interestOne_EN',
              interest_2_EN = '$interestTwo_EN',
              interest_3_EN = '$interestThree_EN',
              interest_4_EN = '$interestFour_EN',
              interest_5_EN = '$interestFive_EN',                           
              time = '$checkboxOne',
              gaeilge = '$checkboxTwo',
              contactApprove = '$checkboxThree',
              approveOne = '$checkboxFour',
              approveOneReference = '$checkboxFive',
              approveTwo = '$checkboxSix',
              approveTwoReference = '$checkboxSeven',
              approved = '$checkboxEigth',
              updateDate = '$updateDate'
              WHERE id = '$id'";
      
      if ($conn->query($sql) === TRUE):        
        echo '{ "alert": "success", "message": "' . $message_success . '" }';
      else:  
        echo '{ "alert": "error", "message": "Couldn't save the data. Please try again later.

**Reason:**
' . $mail->ErrorInfo . '" }';
      endif;
  	} else {
  		echo '{ "alert": "error", "message": "Fill out the form fully and try again" }';
  	}
  }  
  else {
  	echo '{ "alert": "error", "message": "There was an issue. Please try it later" }';
  } 
?>

SSemicolon WebSTAFFApr 22, 2022

Hello,

We already have this feature built within Canvas. You can simply add the data-redirect="https://your-website.com/thank-you.html" Attribute to the .form-widget Element to redirect the Page after Successful Form Submission. Example:
[ch_pre]<div class="form-widget" data-redirect="https://your-website.com/thank-you.html">[/ch_pre]

This will redirect the Page on successful submission. Hope this Helps!

If you need dynamic data from PHP, we recommend using the following:
[ch_pre]echo '{ "alert": "success", "message": "' . $message_success . '", "id": "'. $id .'" }';[/ch_pre]

and then following JS Code at the bottom of the Page:
[ch_pre type="js"]jQuery('#template-contactform').on( 'formSubmitSuccess', function(data){
window.location.replace( 'https://mywebsite.ie/page.html?id='+ data.id +'&action=formupdated' );
});[/ch_pre]

Let us know if we can help you with anything else or if you find any further issues.

CcoconghaileApr 23, 2022

This is excellent. It works a treat. It refreshes the page. Can I ask...is there a way of having the success message popup too after the page refreshes? Because I'm refreshing the page to the same url but with PHP code at the end. I'd love it to refresh on the same page and have the message too because there are a few at work here who won't think it's saved even though they can see the changes :)

">

SSemicolon WebSTAFFApr 24, 2022

Hello,

You will need to use this Code instead:
[ch_pre type="js"]jQuery('#template-contactform').on( 'formSubmitSuccess', function(data){
setTimeout( function(){
window.location.replace( 'https://mywebsite.ie/page.html?id='+ data.id +'&action=formupdated' );
}, 2000);
});[/ch_pre]

This will display the Success Notification and redirect the Page after 2 seconds. Else you will need to use action=formupdated PHP Request/Get to capture the Form Update status and display the Notifications manually according to your needs.

Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.