php - Contact form doesn't work with the new jQuery version (3.3.1)

509

I was mistaken that I was missing anything from my PHP file. The only thing which makes the contact form working is if I use a way older version of the jQuery but that cannot be the case because I need SSL on my site and Google determines the site unsafe which wants to load unsafe scripts if they are older.

Here is the old version of the scripts:

 <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

window.jQuery || document.write('</script>')

   <script type="text/javascript" src="js/jquery-migrate-1.2.1.min.js"></script>

And here is what I was trying to use. I downloaded js files and uploaded to the server but I thinks because of the many function changes my PHP file cannot do the work anymore.

Can somebody help me to update my PHP file because I don't really do coding :o. Tried to understand how it works however I got confused.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

   <script>window.jQuery || document.write('<script src="js/jquery-3.3.1.min.js"><\/script>')</script>

   <script type="text/javascript" src="js/jquery-migrate-3.0.0.min.js"></script>

I use a template from Styleshout called Kreative101 and modified it in many ways but I didn't touch the contact form nor the PHP file (only inserting the error reporting and the email address).

I don't know if it needs any jQuery script in order to work because I did change that and the Modal Popup stopped working. Now it is back to the original (at least the footer with the scripts). The modal works the contact form doesn't.

Any help will be highly appreciated;).

If a reload the page says the action I took will be repeated

The contact form worked before, I tested it.

Here is the HTML code

<section id="contact">

   <div >
     <div >
      <h2>Contact</h2>
      <p >Get in touch with us</p>
     </div>
   </div>

   <div >

     <div >

      <!-- form -->
      <form name="contactForm" id="contactForm" method="post" action="">
          <fieldset>

         <div>
              <label for="contactName">Name <span >*</span></label>
              <input name="contactName" type="text" id="contactName" size="35" value="" />
         </div>

         <div>
              <label for="contactEmail">Email <span >*</span></label>
              <input name="contactEmail" type="text" id="contactEmail" size="35" value="" />
         </div>

         <div>
              <label for="contactSubject">Subject</label>
              <input name="contactSubject" type="text" id="contactSubject" size="35" value="" />
         </div>

         <div>
           <label for="contactMessage">Message <span >*</span></label>
           <textarea name="contactMessage" id="contactMessage" rows="15" cols="50" ></textarea>
         </div>

         <div>
           <button >Submit</button>
           <span id="image-loader">
            <img src="images/loader.gif" alt="" />
           </span>
         </div>

          </fieldset>
        </form> <!-- Form End -->

      <!-- contact-warning -->
      <div id="message-warning"></div>
      <!-- contact-success -->
        <div id="message-success">
        <i ></i>Your message was sent, thank you!<br />
        </div>

     </div>

And the PHP code (I inserted the error reporting but I don't know if it's correct.)

<?php

error_reporting(-1);
ini_set('display_errors', 'On');
set_error_handler("var_dump");

// Replace this with your own email address
$siteOwnersEmail = '[email protected]';


if($_POST) {

   $name = trim(stripslashes($_POST['contactName']));
   $email = trim(stripslashes($_POST['contactEmail']));
   $subject = trim(stripslashes($_POST['contactSubject']));
   $contact_message = trim(stripslashes($_POST['contactMessage']));

   // Check Name
    if (strlen($name) < 2) {
        $error['name'] = "Please enter your name.";
    }
    // Check Email
    if (!preg_match('/^[a-z0-9&\'\.\-_\+][email protected][a-z0-9\-]+\.([a-z0-9\-]+\.)*+[a-z]{2}/is', $email)) {
        $error['email'] = "Please enter a valid email address.";
    }
    // Check Message
    if (strlen($contact_message) < 15) {
        $error['message'] = "Please enter your message. It should have at least 15 characters.";
    }
   // Subject
    if ($subject == '') { $subject = "Contact Form Submission"; }


   // Set Message
   $message .= "Email from: " . $name . "<br />";
    $message .= "Email address: " . $email . "<br />";
   $message .= "Message: <br />";
   $message .= $contact_message;
   $message .= "<br /> ----- <br /> This email was sent from your site's contact form. <br />";

   // Set From: header
   $from =  $name . " <" . $email . ">";

   // Email Headers
    $headers = "From: " . $from . "\r\n";
    $headers .= "Reply-To: ". $email . "\r\n";
    $headers .= "MIME-Version: 1.0\r\n";
    $headers .= "Content-Type: text/html; charset=ISO-8859-1\r\n";


   if (!$error) {

      ini_set("sendmail_from", $siteOwnersEmail); // for windows server
      $mail = mail($siteOwnersEmail, $subject, $message, $headers);

        if ($mail) { echo "OK"; }
      else { echo "Something went wrong. Please try again."; }

    } # end if - no validation error

    else {

        $response = (isset($error['name'])) ? $error['name'] . "<br /> \n" : null;
        $response .= (isset($error['email'])) ? $error['email'] . "<br /> \n" : null;
        $response .= (isset($error['message'])) ? $error['message'] . "<br />" : null;

        echo $response;

    } # end if - there was a validation error

}

?>
932

Answer

Solution:

In the comment I suggested to redirect after sending the mail - not sure if you understood what I meant but like this.

$mail = mail( $siteOwnersEmail, $subject, $message, $headers );
header('Location: ?mailsent=' . $mail ? 'true' : 'error' );

That should prevent the form being submitted if the page is reloaded accidentally etc

You could use that GET variable to display a message to report on status of the mail send.

if( !empty( $_GET['mailsent'] ) ){
    echo $_GET['mailsent']=='true' ? "your message was sent" : "Sorry, there was an error"; /* etc */
}

People are also looking for solutions to the problem: php - woocommerce get_order_report_data to show order_item_id

Source

Didn't find the answer?

Our community is visited by hundreds of web development professionals every day. Ask your question and get a quick answer for free.

Ask a Question

Write quick answer

Do you know the answer to this question? Write a quick response to it. With your help, we will make our community stronger.

Similar questions

Find the answer in similar questions on our website.