Simple feedback form

Mar 13, 2016 laravel feedback form simple email blade
WhatsApp
Today we'll make a feedback form so users can contact you. It's not too difficult and it'll involve the use of setting up a new route, using the Mail class, forms, configuring the settings for our mail server and using the blade templating engine to setup the body of our email.

For our reference you may open up the docs before we begin.

Setting up the Mail server

To set up the mail server we’ll need to sift through our files and find the .env (root project folder) and mail.php file found in your Config folder. The .env file is your projects Environment Configuration file. Looking over the settings, at the bottom we can see that we have several different mail variables set up.

Let’s take a look at what our Outgoing mail settings may look like

MAIL_DRIVER=smtp
MAIL_HOST=smtp.gmail.com
MAIL_PORT=465
MAIL_USERNAME=hello@gmail.com
MAIL_PASSWORD=examplepassword
MAIL_ENCRYPTION=ssl


Preferably we’ll want Encryption, either use ‘tls’ (port 587) or ‘ssl’ (port 465), be sure to check with your mail hosting service for the correct details. You can set Encryption to ‘null’ but that would mean your email will be sent as plain text! Not good!

Find you way over to mail.php under the config folder and we’ll also see similar settings to our environment file. This is because any variable not declared in .env your app will defer to mail.php for the setting.

As an example if the MAIL_PORT was missing we’ll need to fill our the correct port in mail.php. Now let’s quickly test the settings to see if they work


Route

Open up routes.php and we’ll create a test route.

Route::get('emailTest', function() {
//send mail
});


Call the mail class with the ‘send’ static method. The first argument indicates the template location and second is the variable we will pass into the email. Finally the third argument we’ll have a closure function. Let’s take a look what this looks like

Mail::send('emails.test', ['name' => 'Mark'], function($message) {
//email details
}


We’ll always pass the $message variable as this allows for modification of the email itself. With it we can change the sender, receiver, add attachments, cc, bcc, subject and more. Let’s take a look at sending this email to ourselves with a neat little subject. You can find more information under the heading of Building the Message in the Laravel mail docs linked at the beginning of this post.


Route::get('emailTest', function() {
Mail::send('emails.test', ['name' => 'Mark'], function($message) {
$message->to(ouremail@gmail.com', 'Mark')->subject('Whizbang: Laravel Test Email!');
});
});


Here we’re chaining who we’re sending the test email to and what the subject of the email will be, great! But we don’t have a view for our email. We’ll go on a slight tangent here..

Go to your views folder, and because we’ve declared that our test view is locaated at emails.test, create a new folder called ‘emails’ and in it a new template, test.blade.php.

In our test.blade.php we’ll have a little message



Hello {{ $name }}



Welcome to your new feedback! Have a nice day!



Regards,
Whizbang





You’ve noticed that we can use HTML to markup the layout of our email, though I have not tried I don’t see why we cannot apply some css styling as well. Secondly we have successfully passed the name variable to the body of the email. On the receiver end you will find the variable to be replaced with a real person’s name, in this example ‘Mark’.

Open up your browser and head to the test route yourdomain.com/emailTest. A blank page should appear but the only way to know if it was successful at the moment is to check your inbox. If you did receive an email, we can continue.

Before we begin the form we should create a POST route which links to our form

Route::post('contactForm', 'ContactController@postContactForm');

And a contact route to hold the form


Route::get('contact', [
'uses' => 'PagesController@getContactView'
]);


Form

Writing up the form is much like any other form, just ensure you have the correct action and controller


{!! Form::open(array('action' => 'ContactController@postContactForm')) !!}


For me I’ve created a ContactController class and within it a postContactForm() function which is a key link to our route. Once the user selects the submit button, the function will be called to settle our validation, assign the correct email addresses for ‘to’ and ‘from’ fields as well as the subject line or any other features of an email we would like to have like attachments.

As always, having client side validation isn’t enough, I’m using ParsleyJS for that and it’s also critical to have server side validation. Set the rules for our user input and grab the input from the form


$rules = array(
'user_name' => 'required|max:50',
'user_email' => 'required|max:255|email',
'email_body' => 'required|string'
);

$data = Input::all();


With our data and rules, we can check if the user abided by these


$validator = Validator::make($data, $rules);


Check if it is valid and as before use the send() static method to send the email to the user’s email address. You’ll notice below this time around we’ve passed in an associative array, $data, in the second argument to access it in the test.blade.php template and also passed $data with ‘use’.

You can have a subject line field in your form but currently I’ve opted to have a shortened body message limited to 50 characters.


if ($validator->passes()) {

Mail::send('emails.test, ['data' => $data], function($message) use ($data) {
$message->from($data['user_email'], $data['user_name']);
$email_subject = str_limit($data['email_body'], 50);
$message->to('hello@whizbangapps.com', 'Mark')->bcc('markhmwong@gmail.com', 'Whizbang Feedback')->subject('Feedback Form - ' . $email_subject);
});
return redirect('/contact');
}
else {
//something wrong with connection or server?
}



Email Blade Template


There’s not much to be said about our email view as it’s functions in the same manner as a regular view. Here’s what I currently use



{{ $data['email_body'] }}



This was sent via the Feedback form


Twitter




Save the file, and try the new contact form! If you have any problem you can contact me on the same contact form at www.whizbangapps.com/contact.

TL;DR

Setup mail settings and route and add Mail::send() to appropriate file.

Mail::send('emails.test, ['data' => $data], function($message) use ($data) {
$message->from($data['user_email'], $data['user_name']);
$email_subject = str_limit($data['email_body'], 50);
$message->to('hello@whizbangapps.com', 'Mark')->bcc('markhmwong@gmail.com', 'Whizbang Feedback')->subject('Feedback Form - ' . $email_subject);
});

If you found the following info helpful, I'm happy to accept any donations of the following cryptocurrencies.

  • Bitcoin - 17DTiPExzP9StqveW428acEyB4mVMfKbiK
  • Ethereum - 0x87B8307FD20dc90cc05c94905Ec593134D32B6FF
  • Litecoin - LZMiz5U5sVq9doMLYE3gfLJrxCQDKuyCmU
  • Neo - AXv71WB38ajc1KUUEnxQKhynLLPc4BapVb