Contact form question

[rolspace.net]

Hi everyone

I would need help with my contact/order form. What I have so far: functioning contact form with name, email, adress, etc. When clicking send, another php site opens and says "thank you" and an email ist generated and sent off.

What I want to have: Can I send the email off without having to direct to another php site? Is there a way to open a modal window instead? If yes, how?

Thanks!

[flydev]

Yes.

You should use WireMail.

First option, you want to use AJAX to change your HTML markup dynamically. For example, if a client click on the  button 'Buy', it will replace the form markup by a custom message like 'Thanks for your order!' WITHOUT reloading the page. For that, you need a PHP script which handle the mail process (you can found example here on the forum), bootstrapping ProcessWire and a simple Javascript script.

Second option, you set your form action attribute to the same page - <form action="./"> ... </form> - and you process the $_POST variable (or $input->post) in the same page with PHP. This will reload the page, but do not redirect you to another page.

 

Edited September 7, 2016 by flydev
Informations

[rolspace.net]

Thanks for your help. But unfortunately, I don't understand much of your answer . Anyway, I'll go with the version I have for now. Will be alright.

Chance you can tell me how to send the email to two email adresses at the same time? One to the person who sent the email and one to the owner of the site. This ist what I have:

<?php
  if (isset($_POST["isHuman"])) {
    $fullname = $_POST['fullname'];
    $address = $_POST['address'];
    $telephone = $_POST['telephone'];
    $email = $_POST['email'];
    $product = $_POST['product'];
    $recaptcha = $_POST['isHuman'];
    
  }
    $empfaenger = "xxx@xxx.xx";
    $absendername = "Beglinger-Shop";
    $absendermail = $email;
    $betreff = "Order";
    $text = "
   

    Name: ".$_POST['fullname']."\n
    Address: ".$_POST['address']."\n
    Telephone: ".$_POST['telephone']."\n
    Email: ".$_POST['email']."\n
    Article: ".$_POST['product']."\n";
    mail($empfaenger, $betreff, $text, "From: $absendername <$absendermail>");
    echo('<div class="quote"><h3>Your email has been sent.</h3></div>');
?>

I just can't get it to work........

[flydev]

Ok sorry, so lets get started with a step-by-step coding moment. I based the work on your form I found there : http://pingu.eb-zuerich.ch/kurs/bildungsgang28/beglinger/cms/#shop

What we are going to do :

•  installing a module in order to get working with Google ReCaptcha
•  Setting a variable which contain the site owner's address email.

What the code do :

•  check that GoogleRecaptcha is correct
•  check the client's submitted data for security reasons
•  show the form on the page
•  show a message to the client only if captcha and submitted data are correct
•  send email to the site owner and send email to the client's email

 

You can copy the code, it should work fine. But I advice you to try to read it understand so we will go with more PW API next time

Anyway, the following code is taken from here (a topic that is worth to read) and modified for your needs, more infos on the end of the post.

 

1) Install the module MarkupGoogleRecaptcha and configure it :

 

Now the code :

<?php
$emailTo = ''; // address mail of the site owner (you can get this value from a field!)
$emailBackMessage = 'Thanks you for your purshase.';
$captchamod = $modules->get("MarkupGoogleRecaptcha"); // get the module for GoogleReCapatcha
$captcha_form = $captchamod->render(); // render Google ReCaptcha for including it in our form
$sent = false; // check for error
$error = ''; // error message
$out = ''; // this variable will contain our HTML markup

// sanitize form values or create empty
$form = array(
    'product' => $sanitizer->text($input->post->product),
    'fullname' => $sanitizer->text($input->post->fullname),
    'address' => $sanitizer->text($input->post->address),
    'email' => $sanitizer->email($input->post->email),
    'telephone' => $sanitizer->text($input->post->telephone)
);

// check if the form was submitted and if ReCaptcha was check
if($input->post->submit && isset($_POST['g-recaptcha-response'])) {

    if (!$captchamod->verifyResponse()) {
        $error = "<p class='error'>Please check the Google ReCapctha.</p>";
    }

    // determine if any fields were ommitted or didn't validate
    foreach($form as $key => $value) {
        if(empty($value)) $error = "<p class='error'>Please check that you have completed all fields.</p>";
    }

    // if no errors, email the form results
    if(!$error) {
        $message =  "Full name: {$form['fullname']}\n" .
                    "Email: {$form['email']}\n" .
                    "Address: {$form['address']}\n" .
                    "Tel: {$form['telephone']}\n" .
                    "Product: {$form['product']}";
        // send mail to the site owner
        mail($emailTo, "Contact Form", $message, "From: {$form['email']}");
        // send mail to the client
        mail($form['email'], "Contact Form", $emailBackMessage, "From: {$emailTo}");
        // populate body with success message, or pull it from another PW field
        $out = "<div class='alert alert-success'>Thank you, your message and your item has been recorded. An email confirmation as been sent to your inbox.</div>";
        $sent = true;
    }
}

if(!$sent): // if the message was not sent successfully

    // the form markup
    $out = <<<HTML

<div class="alert alert-warning">{$error}</div>

<form role="form" id="frmContact" method="post" action="./">
    <div class="form-group">
    <label for="product">Article:</label>
        <select class="form-control" name="product" id="product">
            <option>T-Shirt: white, slim</option>
            <option>Jacket: leather, black</option>
            <option>T-Shirt: grey, logo-print (reserved)</option>
            <option>T-Shirt: green, bus-print</option>
        </select>
    </div>
    <div class="form-group">
        <label for="fullname">Name:</label>
        <input type="text" class="form-control" name="fullname" id="fullname" required>
    </div>
    <div class="form-group">
        <label for="address">Address:</label>
        <input type="text" class="form-control" name="address" id="address" required>
    </div>
    <div class="form-group">
        <label for="email">Email:</label>
        <input type="email" class="form-control" name="email" id="email" required>
    </div>
    <div class="form-group">
        <label for="telephone">Telephone:</label>
        <input type="tel" class="form-control" name="telephone" id="telephone" required>
    </div>

    {$captcha_form}

    <button type="submit" class="btn btn-warning" name="submit" id="submitBtn" value="submit">Buy</button>
</form>
HTML;

endif; // end if | email not !sent

echo $out; // echo the markup

?>

The code is well commented and self explanatory.

 

2) Set the email of the site owner. In the code :

$emailTo = ''; // address mail of the site owner (you can get this value from a field!)

 

Now you should be able to copy-pasta the code in place of the form in your page

 

 

 

 

Edited September 8, 2016 by flydev
Code // $out // markup

[pwired]

Thanks flydev for posting that code.

I have seen many times example code like that but never really figured out what those following HTML parts are doing:

 

$content = <<<HTML
. . .
. . .
HTML;

Its probably a php thing ...

[Robin S]

1 hour ago, pwired said:

Its probably a php thing ...

http://php.net/manual/en/language.types.string.php#language.types.string.syntax.heredoc