php Ajax在等待响应时加载gif

Posted 2021-05-05

https://stackoverflow.com/questions/68485/how-to-show-loading-spinner-in-jquery
<img src='https://prestigepay.com/wp-content/themes/pop/images/spinner.gif'>



https://stackoverflow.com/questions/4684722/show-loading-image-while-ajax-is-performed


HTML


<form>
  // ...
</form>

<div id="loader" class="col-md-12" style="display:none;"><img src='https://prestigepay.com/wp-content/themes/pop/images/spinner.gif'></div>
							
<div class="col-md-12 text-center"><div id="result" class="alert alert-success" style="display:none;"></div></div>


<style>
  
#loader {
    display: none;
    position: fixed;
    background: rgba(0, 0, 0, 0.66);
    width: 100%;
    top: 0;
    bottom: 0;
    left: 0;
    padding-top: 15%;
    overflow: hidden;
    margin: 0 auto;
    text-align: center;
}

  
</style>


<script>
  
jQuery(document).ready(function() {
	jQuery("#leadform").submit(function(event) {
	    jQuery('#loader').show() ;
	    /* Stop form from submitting normally */
	    event.preventDefault();

	    var g_recaptcha_response  = jQuery('#g-recaptcha-response').val();

	    var values = jQuery(this).serialize();

	    /* Clear result div*/
	    jQuery("#result").html('');
	    
        ajaxRequest = jQuery.ajax({
            url: "<?php echo get_template_directory_uri() ; ?>/send_tuftedcylinderbrushquote.php",
            type: "post",
            data: values
        });


        ajaxRequest.done(function (response, textStatus, jqXHR){
          // show successfully for submit message
          console.log("SUCCESS") ;
          jQuery('#result').show() ;
          jQuery("#result").html(response);
          jQuery('#loader').hide() ;
        });

        /* On failure of request this function will be called  */
        ajaxRequest.fail(function (response){
        // show error
        console.log(" ajax fail ERROR" + response) ;
        jQuery("#result").html('Error found trying to submit the form: ' + response );
        });

	});

}); // end document ready  
  
  
</script>




<?php

<?php
/*
echo '<pre>';
print_r($_POST) ;
echo '</pre>';
exit; 
*/

require 'PHPMailerAutoload.php';
require_once 'Recaptcha.php';
// require_once dirname(__FILE__) . '/Recaptcha.php';
if ( ! class_exists('Recaptcha') ) die('Class Recaptcha not found') ; 

$recaptcha = $_POST['g-recaptcha-response'];

/*
$name  = $_POST['name'] ;
$email  = $_POST['email'] ;
$message  = $_POST['message'] ;

*/

extract($_POST) ;
$current_date = date('n/j/Y'); 
$current_time = date('g:i a') ;
$recobj = new Recaptcha();
$response = $recobj->verifyResponse($recaptcha);

if( isset($response['success']) && $response['success'] != true )  {
	echo "An Error Occured and Error code is :".$response['error-codes'];
}
else {
	/*
	echo 'Correct Recaptcha<br>
	 Name: ' . $name . '<br>' .
	'Email: ' . $email . '<br>'  .
	'Message: ' . $message . '<br>'  .
	'recaptcha value: ' . $recaptcha ;
	*/
	

	$mail = new PHPMailer;
	
	//$mail->SMTPDebug = 3;                               // Enable verbose debug output
	
	$mail->isSMTP();                                      // Set mailer to use SMTP
	$mail->SMTPAuth   = true;                  // enable SMTP authentication
	$mail->SMTPSecure = "tls";                 // sets the prefix to the servier
	$mail->Host       = "mail.smtp2go.com ";      // sets GMAIL as the SMTP server
	$mail->Port       = 80;                   // set the SMTP port for the GMAIL server
	$mail->Username   = "armadillo";  // GMAIL username
	$mail->Password   = "popadmin7480#";                              
	
	$mail->setFrom('[e-mail]', 'BristleBarn Admin');
	$mail->addReplyTo('[e-mail]', 'reply to');
	$mail->addAddress('[e-mail]', 'Bristle Barn');     // Add a recipient
	//$mail->addAddress('[e-mail]');               // Name is optional
	//$mail->addCC('[e-mail]');
	//$mail->addBCC('[e-mail]');
	
	//$mail->addAttachment('/var/tmp/file.tar.gz');         // Add attachments
	//$mail->addAttachment('/tmp/image.jpg', 'new.jpg');    // Optional name
	$mail->isHTML(true);                                  // Set email format to HTML
	
	$mail->Subject = 'New Lead: ' . $product_title ;
	$mail->Body    = "
    ==================================== <br>
    INDUSTRIAL BRUSH CORPORATION<br>
    Internet Information Form   -  Contact<br>
    Date: $current_date Time:  $current_time<br>
    ====================================<br>
    
    <strong>Product Name:</strong> $product_title<br>
    <strong>Company Name:</strong> $company<br>
    <strong>Address:</strong>   $address<br>
    <strong>City:</strong>   $city<br>
    <strong>State: </strong>  $state<br>
    <strong>Zip:</strong>   $zip<br>
    <strong>Phone Number:</strong> $phonenumber    <br>
    <strong>Email: </strong>   $email<br>
    <strong>Contact Name:</strong> $contactname<br>
    <strong>A. Tufted Cylinder Brush Face Length:</strong> $tuftedcylinder<br>
    <strong>B. Core Length:</strong> $corelength <br>
    <strong>C. Core Diameter: </strong>$corediameter <br>
    <strong>Specify Other Core Diameter:</strong>  $specifycorediameter<br>
    <strong>D. Tuft Hole Diameter: (Thousandth of Inch): </strong> $tufthole   <br>
    <strong>E. Brush Outside Diameter: </strong> $brushoutsidediameter<br>
    <strong>F. Bristle Type:</strong> $bristletype<br>
    <strong>Specify Other Bristle Type:</strong> $specifybristletype    <br>
    <strong>Bristle Color:</strong> $bristlecolor    <br>
    <strong>Angle:</strong> $angle    <br>
    <strong>Type of Tufted Pattern:</strong> $tuftedpattern    <br>
    <strong>G. Radial Spacing:</strong> $radialspacing    <br>
    <strong>H. Lateral Spacing: </strong>$lateralspacing    <br>
    <strong>End Bushings: </strong>$endbushings    <br>
    <strong>Specify Other Type of End: </strong>$specifyothertypeofend    <br>
    <strong>Order Quantity:</strong> $orderquantity<br>
    <strong>Annual Usage:</strong> $annualusage<br>
    <strong>Additional Information:</strong> $additionalnotes<br>
    
	
	" ;
	
	// $mail->AltBody = 'This is the body in plain text for non-HTML mail clients';
	
	if(!$mail->send() ) {
	    echo 'Message could not be sent.';
	    //echo 'Mailer Error: ' . $mail->ErrorInfo;
	} else {
	    echo 'Message has been sent';
	}	
		
	
}