Quantcast
Channel: Active questions tagged email - Stack Overflow
Viewing all articles
Browse latest Browse all 29901

How can i add recaptcha properly to my html form?

$
0
0

I have an AJAX HTML form with validation fields. So my problem is that i'm stuck. I want to embed a recaptcha in my form. I want to produce the following result. If the user completes the recaptcha then the form will be sended. Now if i complete the form and the recaptcha correctly the form is not sended.

HTML

    function sendContact() {
                            var valid;  
                            valid = validateContact();
                            if(valid) {
                                jQuery.ajax({
                                url: "contact_mail.php",
                                data:'userName='+$("#userName").val()+'&userEmail='+$("#userEmail").val()+'&subject='+$("#subject").val()+'&content='+$(content).val(),
                                type: "POST",
                                success:function(data){
                                $("#mail-status").html(data);
                                },
                                error:function (){}
                                });
                            }
                        }

                        function validateContact() {
                            var valid = true;   
                            $(".demoInputBox").css('background-color','');
                            $(".info").html('');

                            if(!$("#userName").val()) {
                                $("#userName-info").html("<span style='color: #F00423';>Απαιτούμενο πεδίο</span>");
                                $("#userName").css('background-color','#3E3E3E');
                                valid = false;
                            }
                            if(!$("#userEmail").val()) {
                                $("#userEmail-info").html("<span style='color: #F00423';>Απαιτούμενο πεδίο</span>");
                                $("#userEmail").css('background-color','#3E3E3E');
                                valid = false;
                            }
                            if(!$("#userEmail").val().match(/^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/)) {
                                $("#userEmail-info").html("<span style='color: #F00423';>Απαιτούμενο πεδίο</span>");
                                $("#userEmail").css('background-color','#3E3E3E');
                                valid = false;
                            }
                            if(!$("#subject").val()) {
                                $("#subject-info").html("<span style='color: #F00423';>Απαιτούμενο πεδίο</span>");
                                $("#subject").css('background-color','#3E3E3E');
                                valid = false;
                            }
                            if(!$("#content").val()) {
                                $("#content-info").html("<span style='color: #F00423';>Απαιτούμενο πεδίο</span>");
                                $("#content").css('background-color','#3E3E3E');
                                valid = false;
                            }

                            return valid;
                        }
                        </script>

                            <div id="frmContact">
                        <div id="mail-status"></div>
                        <div>
                        <span id="userName-info" class="info"></span><br/>
                        <input type="text" name="userName" id="userName" class="form-control form-dark demoInputBox" placeholder="Όνομα">
                        </div>
                        <div>
                        <span id="userEmail-info" class="info"></span><br/>
                        <input type="text" name="userEmail" id="userEmail" class="form-control form-dark demoInputBox" placeholder="Email">
                        </div>
                        <div>
                        <span id="subject-info" class="info"></span><br/>
                        <input type="number" name="subject" id="subject" class="form-control form-dark demoInputBox" placeholder="Τηλέφωνο">
                        </div>
                        <div>
                        <span id="content-info" class="info"></span><br/>
                        <textarea name="content" id="content" class="form-control form-dark demoInputBox" cols="60" rows="6" placeholder="Μήνυμα"></textarea>
                        </div>
                        <div>
                        <div class="g-recaptcha" data-theme="dark" data-sitekey="6LcoXZ0UAAAAAMdgKIlchJvizDWic5S7nwr5XD3g"></div>
                        <button name="submit" class="btn btn-border border-white btnAction" onClick="sendContact();">Αποστολη</button>
                        </div>
                        </div>

PHP

<?php
if ($_SERVER["REQUEST_METHOD"] == "POST") {
    // access
    $secretKey = '6LcoXZ0UAAAAAF3U4SSfiKPZ7NWyuATN7NFh8fKE';
    $captcha = $_POST['g-recaptcha-response'];

    if(!$captcha){
      echo '<p class="alert alert-warning">Please check the the captcha form.</p>';
      exit;
    } 


    $ip = $_SERVER['REMOTE_ADDR'];
    $response=file_get_contents("https://www.google.com/recaptcha/api/siteverify?secret=".$secretKey."&response=".$captcha."&remoteip=".$ip);
    $responseKeys = json_decode($response,true);

    if(intval($responseKeys["success"]) !== 1) {
      echo '<p class="alert alert-warning">Please check the the captcha form.</p>';
    } else {

        $to = "vp@digital-media.gr";
        $msg = "name:\t$_REQUEST[userName]\n";
        $msg .= "email:\t$_REQUEST[userEmail]\n";
        $msg .= "tel:\t$_REQUEST[subject]\n";
        $msg .= "message:\t$_REQUEST[content]\n";
        $success = mail($to, "Mail from our site", $msg, "Content-type: text/plain; charset=UTF-8");
        if($success) { 
            print "<p class='success'>Ευχαριστούμε, το μήνυμα σας έχει σταλθεί. Θα σας απαντήσουμε το συντομότερο.</p>";
                } else {
                print "<p class='Error'>Υπήρξε ένα σφάλμα, δοκιμάστε αργότερα! </p>";
                }
    }

?>


Viewing all articles
Browse latest Browse all 29901

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>