i work on wordpress website , i'm trying create form (with ajax call) apears on every's product pages. i've tried on other servers, worked nice, when integrate code in wordpress page not working. i'm using woocomerce php file i'm trying modify "content-single-product.php"
my code:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script> <script type="text/javascript"> $(document).ready(function() { $("#submit_btn").click(function() { var proceed = true; //simple validation @ client's end //loop through each field , change border color red invalid fields $("#contact_form input[required=true], #contact_form textarea[required=true]").each(function(){ $(this).css('border-color',''); if(!$.trim($(this).val())){ //if field empty $(this).css('border-color','red'); //change border color red proceed = false; //set not proceed flag } //check invalid email var email_reg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/; if($(this).attr("type")=="email" && !email_reg.test($.trim($(this).val()))){ $(this).css('border-color','red'); //change border color red proceed = false; //set not proceed flag } }); if(proceed) //everything looks good! proceed... { //get input field values data sent server post_data = { 'user_email' : $('input[name=email]').val(), 'phone_number' : $('input[name=telefon]').val(), }; //ajax post data server $.post('*the path php file*', post_data, function(response){ if(response.type == 'error'){ //load json data server , output message output = '<div class="error">'+response.text+'</div>'; }else{ output = '<div class="success">'+response.text+'</div>'; //reset values in input fields $("#contact_form input[required=true], #contact_form textarea[required=true]").val(''); $("#contact_form #contact_body").slideup(); //hide form after success } $("#contact_form #contact_results").hide().html(output).slidedown(); }, 'json'); } }); //reset set border colors , hide message on .keyup() $("#contact_form input[required=true], #contact_form textarea[required=true]").keyup(function() { $(this).css('border-color',''); $("#result").slideup(); }); }); </script> <div style="padding-bottom: 15px; border-bottom: 1px solid #999999;" id="contact_form"> <div id="contact_results"></div> <div id="contact_body"> <div style="color:#ff0000; font-size:12px;">title text</div> <p> <div style="color:#999999; font-size:12px;">description text</div> </p> <label><span>phone: </span> <input type="text" name="telefon" maxlength="15" required="true" placeholder="phone"/> </label> <label><span>e-mail: </span> <input type="email" name="email" required="true" class="input-field" placeholder="e-mail adress"/> </label> <label> <span> </span><input type="submit" id="submit_btn" value="order now" /> </label> </div> </div>
and php code is
<?php if($_post) { $to_email = "email@email.com"; //recipient email, replace own email here //check if ajax request, exit if not if(!isset($_server['http_x_requested_with']) , strtolower($_server['http_x_requested_with']) != 'xmlhttprequest') { $output = json_encode(array( //create json data 'type'=>'error', 'text' => 'sorry request must ajax post' )); die($output); //exit script outputting json data } //sanitize input data using php filter_var(). $user_email = filter_var($_post["user_email"], filter_sanitize_email); $phone_number = filter_var($_post["phone_number"], filter_sanitize_number_int); $url = filter_var($_server['http_referer']); //additional php validation if(!filter_var($user_email, filter_validate_email)){ //email validation $output = json_encode(array('type'=>'error', 'text' => 'please enter valid email!')); die($output); } if(!filter_var($phone_number, filter_sanitize_number_float)){ //check valid numbers in phone number field $output = json_encode(array('type'=>'error', 'text' => 'enter digits in phone number')); die($output); } //email body $subject = "client nou ! - telefon: ". $phone_number; $message_body = "\r\nnumar de telefon : ". $phone_number."\r\nclientul este interesat de urmatorul produs : ". $url; //proceed php email. $headers = 'from: '.$user_email.'' . "\r\n" . 'x-mailer: php/' . phpversion(); $send_mail = mail($to_email, $subject, $message_body, $headers); if(!$send_mail) { //if mail couldn't sent output error. check php email configuration (if ever happens) $output = json_encode(array('type'=>'error', 'text' => 'could not send mail! please check php mail configuration.')); die($output); }else{ $output = json_encode(array('type'=>'message', 'text' => '<div style="color:#999999; font-size:12px;">the order sent. in few moments contact @ phone number <strong>'.$phone_number .'</strong>!</div>')); die($output); } } ?>
i'm not experienced wordpress. have adapt somehow, think. that's question. thank !
i think you're looking this: https://codex.wordpress.org/ajax_in_plugins
in code need add action post data:
post_data = { 'user_email' : $('input[name=email]').val(), 'phone_number' : $('input[name=telefon]').val(), 'action' : 'my_custom_send_mail', 'nonce' : '<?php wp_create_nonce('mycustom_mail_form_nonce'); ?>' };
instead of *the path php file*
need call <?php echo admin_url('admin-ajax.php'); ?>
.
then in functions.php or my-plugin.php can call function:
add_action( 'wp_ajax_my_custom_send_mail', 'my_custom_send_mail_callback' ); add_action( 'wp_ajax_nopriv_my_custom_send_mail', 'my_custom_send_mail_callback' ); function my_custom_send_mail_callback(){ if(!check_ajax_referer( 'mycustom_mail_form_nonce', 'nonce' )){ $output = json_encode(array('type'=>'error', 'text' => 'something went wrong!')); die($output); } $to_email = "email@email.com"; $user_email = sanitize_email($_post["user_email"]); $phone_number = filter_var($_post["phone_number"], filter_sanitize_number_int); if(!is_email($user_email)){ $output = json_encode(array('type'=>'error', 'text' => 'please enter valid email!')); die($output); } if(!filter_var($phone_number, filter_sanitize_number_float)){ //check valid numbers in phone number field $output = json_encode(array('type'=>'error', 'text' => 'enter digits in phone number')); die($output); } //email body $subject = "client nou ! - telefon: ". $phone_number; $message_body = "\r\nnumar de telefon : ". $phone_number."\r\nclientul este interesat de urmatorul produs : ". $url; //proceed php email. $headers = 'from: '.$user_email.'' . "\r\n" . 'x-mailer: php/' . phpversion(); $send_mail = wp_mail($to_email, $subject, $message_body, $headers); if(!$send_mail){ $output = json_encode(array('type'=>'error', 'text' => 'could not send mail! please check php mail configuration.')); die($output); }else{ $output = json_encode(array('type'=>'message', 'text' => '<div style="color:#999999; font-size:12px;">the order sent. in few moments contact @ phone number <strong>'.$phone_number .'</strong>!</div>')); die($output); } }
Comments
Post a Comment