How to Send Uploaded File as Email Attachment in Laravel

  1. Create the upload form
  2. Process the submitted form
  3. Create email sender class
  4. Create the email template
<form action="{{ url('uploadDocument') }}" method="post" enctype="multipart/form-data">
   @csrf
   <div class="form-group">
      <input type="text" class="form-control" name="name" placeholder="Name">
   </div>
   <div class="form-group">
      <input type="email" class="form-control" name="email" placeholder="Email address">
   </div>
   <div class="form-group">
      <input type="number" class="form-control" name="contact" placeholder="Contact number">
   </div>
   <div class="form-group">
      <input type="text" class="jobTitle form-control" name="area" placeholder="Functional Area">
   </div>
   <div class="form-group">
      <input type="file" name="document" class="form-control">
   </div>
   <button type="submit" class="btn apply_btn">Apply Now</button>
</form>

Step 2: Process the Submitted Form

<?php

  public function uploadDocument(Request $request) 
    {
        $document = $request->file('document');
        // Required validation
        $request->validate([
            'name' => 'required',
            'email' => 'required',
            'contact' => 'required',
            'area' => 'required',
        ]);
        $name = $request->input('name');
        $email = $request->input('email');
        $contact = $request->input('contact');
        $area = $request->input('area');
        // Check if uploaded file size was greater than 
        // maximum allowed file size
        if ($document->getError() == 1) {
            $max_size = $document->getMaxFileSize() / 1024 / 1024;  // Get size in Mb
            $error = 'The document size must be less than ' . $max_size . 'Mb.';
            return redirect()->back()->with('flash_danger', $error);
        }
        $data = [
              'document' => $document,
              'name' => $name,
              'contact' => $contact,
              'area' => $area,
              'email' => $email,
        ];
        
        // If upload was successful
        // send the email
        $to_email = '[email protected]';
        \Mail::to($to_email)->send(new \App\Mail\Upload($data));
        return redirect()->back()->with('flash_success', 'Your document has been uploaded.');
    }

Step 3: Create email sender class

<?php
#App\Mail\Upload.php

namespace App\Mail;

use Illuminate\Bus\Queueable;
use Illuminate\Mail\Mailable;
use Illuminate\Queue\SerializesModels;

class Upload extends Mailable
{
    use Queueable, SerializesModels;

    public $data;

    /**
     * Create a new message instance.
     *
     * @return void
     */
    public function __construct($data=[])
    {
        $this->data = $data;
    }

    /**
     * Build the message.
     *
     * @return $this
     */
    public function build()
    {
        return $this->view('emails/upload')
                ->subject('Motherson Sumi Systems Career')
                ->attach($this->data['document']->getRealPath(),
                [
                    'as' => $this->data['document']->getClientOriginalName(),
                    'mime' => $this->data['document']->getClientMimeType(),
                ]);
    }
}

Step 4: Create the email template

<!doctype html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office">
   <head>
      <title>Lead From Motherson Sumi Systems</title>
      <!--[if !mso]><!-- --> 
      <meta http-equiv="X-UA-Compatible" content="IE=edge">
      <!--<![endif]--> 
      <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
      <meta name="viewport" content="width=device-width, initial-scale=1">
      <style type="text/css"> span.productOldPrice { color: #A0131C; text-decoration: line-through;} #outlook a { padding: 0; } body { margin: 0; padding: 0; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; } table, td { border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; } img { border: 0; height: auto; line-height: 100%; outline: none; text-decoration: none; -ms-interpolation-mode: bicubic; } p { display: block; margin: 13px 0; } </style>
      <!--[if mso]> 
      <xml>
         <o:OfficeDocumentSettings>
            <o:AllowPNG/>
            <o:PixelsPerInch>96</o:PixelsPerInch>
         </o:OfficeDocumentSettings>
      </xml>
      <![endif]--> <!--[if lte mso 11]> 
      <style type="text/css"> .outlook-group-fix { width:100% !important; } </style>
      <![endif]--> <!--[if !mso]><!--> 
      <link href="https://fonts.googleapis.com/css?family=Open+Sans:300,400,500,700" rel="stylesheet" type="text/css">
      <style type="text/css"> @import url(https://fonts.googleapis.com/css?family=Open+Sans:300,400,500,700); </style>
      <!--<![endif]--> 
      <style type="text/css"> @media only screen and (min-width:480px) { .column-per-100 { width: 100% !important; max-width: 100%; } .column-per-25 { width: 25% !important; max-width: 25%; } .column-per-75 { width: 75% !important; max-width: 75%; } .column-per-48-4 { width: 48.4% !important; max-width: 48.4%; } .column-per-50 { width: 50% !important; max-width: 50%; } } </style>
      <style type="text/css"> @media only screen and (max-width:480px) { table.full-width-mobile { width: 100% !important; } td.full-width-mobile { width: auto !important; } } noinput.menu-checkbox { display: block !important; max-height: none !important; visibility: visible !important; } @media only screen and (max-width:480px) { .menu-checkbox[type="checkbox"]~.inline-links { display: none !important; } .menu-checkbox[type="checkbox"]:checked~.inline-links, .menu-checkbox[type="checkbox"]~.menu-trigger { display: block !important; max-width: none !important; max-height: none !important; font-size: inherit !important; } .menu-checkbox[type="checkbox"]~.inline-links>a { display: block !important; } .menu-checkbox[type="checkbox"]:checked~.menu-trigger .menu-icon-close { display: block !important; } .menu-checkbox[type="checkbox"]:checked~.menu-trigger .menu-icon-open { display: none !important; } } </style>
      <style type="text/css"> @media only screen and (min-width:481px) { .products-list-table img { width: 120px !important; display: block; } .products-list-table .image-column { width: 20% !important; } } a { color: #000; } .server-img img { width: 100% } .server-box-one a, .server-box-two a { text-decoration: underline; color: #2E9CC3; } .server-img img { width: 100% } .server-box-one a, .server-box-two a { text-decoration: underline; color: #2E9CC3; } .server-img img { width: 100% } .server-box-one a, .server-box-two a { text-decoration: underline; color: #2E9CC3; } </style>
   </head>
   <body style="background-color:#FFFFFF;">
      <div style="font-family: Open Sans, Helvetica, Tahoma, Arial, sans-serif; background-color: #FFFFFF;">
         <!-- Body Wrapper --> <!--[if mso | IE]> 
         <table align="center" border="0" cellpadding="0" cellspacing="0" class="body-wrapper-outlook" style="width:600px;" width="600" >
            <tr>
               <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
                  <![endif]--> 
                  <div class="body-wrapper" style="font-family: Open Sans, Helvetica, Tahoma, Arial, sans-serif; padding-bottom: 20px; box-shadow: 0 4px 10px #ddd; background: #F2F2F2; background-color: #F2F2F2; margin: 0px auto; max-width: 600px; margin-bottom: 10px;">
                     <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background:#F2F2F2;background-color:#F2F2F2;width:100%;">
                        <tbody>
                           <tr>
                              <td style="font-family: Open Sans, Helvetica, Tahoma, Arial, sans-serif; direction: ltr; font-size: 0px; padding: 10px 20px; text-align: center;" align="center">
                                 <!--[if mso | IE]> 
                                 <table role="presentation" border="0" cellpadding="0" cellspacing="0">
                                    <![endif]--> <!-- Pre-Headers --> <!--[if mso | IE]> 
                                    <tr>
                                       <td class="pre-header-outlook" width="600px" >
                                          <table align="center" border="0" cellpadding="0" cellspacing="0" class="pre-header-outlook" style="width:560px;" width="560" >
                                             <tr>
                                                <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
                                                   <![endif]--> 
                                                   <div class="pre-header" style="font-family: Open Sans, Helvetica, Tahoma, Arial, sans-serif; height: 1px; overflow: hidden; margin: 0px auto; max-width: 560px;">
                                                      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;">
                                                         <tbody>
                                                            <tr>
                                                               <td style="font-family: Open Sans, Helvetica, Tahoma, Arial, sans-serif; direction: ltr; font-size: 0px; padding: 0px; text-align: center;" align="center">
                                                                  <!--[if mso | IE]> 
                                                                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
                                                                     <tr>
                                                                        <td class="" style="vertical-align:top;width:560px;" >
                                                                           <![endif]--> 
                                                                           <div class="column-per-100 outlook-group-fix" style="font-family: Open Sans, Helvetica, Tahoma, Arial, sans-serif; font-size: 0px; text-align: left; direction: ltr; display: inline-block; vertical-align: top; width: 100%;">
                                                                              <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;" width="100%">
                                                                                 <tr>
                                                                                    <td align="center" style="font-family: Open Sans, Helvetica, Tahoma, Arial, sans-serif; font-size: 0px; padding: 0; word-break: break-word;">
                                                                                       <div style="font-family: Open Sans, Helvetica, Tahoma, Arial, sans-serif; font-size: 1px; font-weight: 400; line-height: 0; text-align: center; color: #F2F2F2;"> Mail from Motherson Sumi Systems </div>
                                                                                    </td>
                                                                                 </tr>
                                                                              </table>
                                                                           </div>
                                                                           <!--[if mso | IE]> 
                                                                        </td>
                                                                     </tr>
                                                                  </table>
                                                                  <![endif]--> 
                                                               </td>
                                                            </tr>
                                                         </tbody>
                                                      </table>
                                                   </div>
                                                   <!--[if mso | IE]> 
                                                </td>
                                             </tr>
                                          </table>
                                       </td>
                                    </tr>
                                    <![endif]--> <!-- header --> <!--[if mso | IE]> 
                                    <tr>
                                       <td class="header-outlook" width="600px" >
                                          <table align="center" border="0" cellpadding="0" cellspacing="0" class="header-outlook" style="width:560px;" width="560" >
                                             <tr>
                                                <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
                                                   <![endif]--> 
                                                   <div class="header" style="font-family: Open Sans, Helvetica, Tahoma, Arial, sans-serif; line-height: 22px; padding: 15px 0; margin: 0px auto; max-width: 560px;">
                                                      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;">
                                                         <tbody>
                                                            <tr>
                                                               <td style="font-family: Open Sans, Helvetica, Tahoma, Arial, sans-serif; direction: ltr; font-size: 0px; padding: 0px; text-align: center;" align="center">
                                                                  <!--[if mso | IE]> 
                                                                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
                                                                     <tr>
                                                                        <![endif]--> <!-- LOGO --> <!--[if mso | IE]> 
                                                                        <td class="" style="vertical-align:middle;width:140px;" >
                                                                           <![endif]--> 
                                                                           <div class="column-per-25 outlook-group-fix" style="font-family: Open Sans, Helvetica, Tahoma, Arial, sans-serif; font-size: 0px; text-align: left; direction: ltr; display: inline-block; vertical-align: middle; width: 100%;">
                                                                              <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:middle;" width="100%">
                                                                                 <tr>
                                                                                    <td align="center" style="font-family: Open Sans, Helvetica, Tahoma, Arial, sans-serif; font-size: 0px; padding: 0; word-break: break-word;">
                                                                                       <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-collapse:collapse;border-spacing:0px;">
                                                                                          <tbody>
                                                                                             <tr>
                                                                                                <td style="font-family: Open Sans, Helvetica, Tahoma, Arial, sans-serif;width: 160px;" width="160"> <a href="https://Motherson Sumi Systems.com/" target="_blank" style="font-family: Open Sans, Helvetica, Tahoma, Arial, sans-serif; padding: 0 10px;"> <img alt="Motherson Sumi Systems" height="auto" src="{{ url('assets/images/redlogo.png')  }}" style="border:0;display:block;outline:none;text-decoration:none;height:auto;width:100%;font-size:13px;" width="160"> </a> </td>
                                                                                             </tr>
                                                                                          </tbody>
                                                                                       </table>
                                                                                    </td>
                                                                                 </tr>
                                                                              </table>
                                                                           </div>
                                                                           <!--[if mso | IE]> 
                                                                        </td>
                                                                        <![endif]--> <!-- Navigation Bar --> <!--[if mso | IE]> 
                                                                        <td class="navigation-bar-outlook" style="vertical-align:middle;width:420px;" >
                                                                           <![endif]--> 
                                                                           <div class="column-per-75 outlook-group-fix navigation-bar" style="font-family: Open Sans, Helvetica, Tahoma, Arial, sans-serif; font-size: 0px; text-align: left; direction: ltr; display: inline-block; vertical-align: middle; width: 100%;">
                                                                              <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:middle;" width="100%">
                                                                                 <tr>
                                                                                    <td align="right" style="font-family: Open Sans, Helvetica, Tahoma, Arial, sans-serif; text-align: right; font-size: 0px; word-break: break-word;">
                                                                                       <div class="inline-links" style="font-family: Open Sans, Helvetica, Tahoma, Arial, sans-serif;">
                                                                                          <!--[if mso | IE]> 
                                                                                          <table role="presentation" border="0" cellpadding="0" cellspacing="0" align="center">
                                                                                             <tr>
                                                                                                <td style="padding:15px 10px;" class="" >
                                                                                                   <![endif]--> <!--[if mso | IE]> 
                                                                                                </td>
                                                                                             </tr>
                                                                                          </table>
                                                                                          <![endif]--> 
                                                                                       </div>
                                                                                    </td>
                                                                                 </tr>
                                                                              </table>
                                                                           </div>
                                                                           <!--[if mso | IE]> 
                                                                        </td>
                                                                     </tr>
                                                                  </table>
                                                                  <![endif]--> 
                                                               </td>
                                                            </tr>
                                                         </tbody>
                                                      </table>
                                                   </div>
                                                   <!--[if mso | IE]> 
                                                </td>
                                             </tr>
                                          </table>
                                       </td>
                                    </tr>
                                    <![endif]--> <!-- notice --> <!--[if mso | IE]> 
                                    <tr>
                                       <td class="notice-wrap-outlook margin-bottom-outlook" width="600px" >
                                          <table align="center" border="0" cellpadding="0" cellspacing="0" class="notice-wrap-outlook margin-bottom-outlook" style="width:560px;" width="560" >
                                             <tr>
                                                <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
                                                   <![endif]--> 
                                                   <div class="notice-wrap margin-bottom" style="font-family: Open Sans, Helvetica, Tahoma, Arial, sans-serif; margin: 0px auto; max-width: 560px; margin-bottom: 15px;">
                                                      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;">
                                                         <tbody>
                                                            <tr>
                                                               <td style="font-family: Open Sans, Helvetica, Tahoma, Arial, sans-serif; direction: ltr; font-size: 0px; padding: 0px; text-align: center;" align="center">
                                                                  <!--[if mso | IE]> 
                                                                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
                                                                     <tr>
                                                                        <td class="" style="vertical-align:top;width:560px;" >
                                                                           <![endif]--> 
                                                                           <div class="column-per-100 outlook-group-fix" style="font-family: Open Sans, Helvetica, Tahoma, Arial, sans-serif; font-size: 0px; text-align: left; direction: ltr; display: inline-block; vertical-align: top; width: 100%;">
                                                                              <table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%">
                                                                                 <tbody>
                                                                                    <tr>
                                                                                       <td style="font-family: Open Sans, Helvetica, Tahoma, Arial, sans-serif; background-color: #ffffff; border-radius: 10px; vertical-align: top; padding: 30px 25px;" bgcolor="#ffffff" valign="top">
                                                                                          <table border="0" cellpadding="0" cellspacing="0" role="presentation" style width="100%">
                                                                                             <tr>
                                                                                                <td align="left" class="link-wrap" style="font-family: Open Sans, Helvetica, Tahoma, Arial, sans-serif; font-size: 0px; padding: 0; padding-bottom: 20px; word-break: break-word;">
                                                                                                   <div style="font-family: Open Sans, Helvetica, Tahoma, Arial, sans-serif; font-size: 16px; font-weight: 300; line-height: 25px; text-align: left; color: #4F4F4F;">Hi Team, <br></div>
                                                                                                </td>
                                                                                             </tr>
                                                                                             <tr>
                                                                                                <td align="left" class="link-wrap" style="font-family: Open Sans, Helvetica, Tahoma, Arial, sans-serif; font-size: 0px; padding: 0; padding-bottom: 20px; word-break: break-word;">
                                                                                                   <div style="font-family: Open Sans, Helvetica, Tahoma, Arial, sans-serif; font-size: 16px; font-weight: 300; line-height: 25px; text-align: left; color: #4F4F4F;">Lead From Motherson Sumi Systems.<br></div>
                                                                                                </td>
                                                                                             </tr>
                                                                                             <tr>
                                                                                                <td align="left" class="link-wrap" style="font-family: Open Sans, Helvetica, Tahoma, Arial, sans-serif; font-size: 0px; padding: 0; padding-bottom: 20px; word-break: break-word;">
                                                                                                   <div style="font-family: Open Sans, Helvetica, Tahoma, Arial, sans-serif; font-size: 16px; font-weight: 300; line-height: 25px; text-align: left; color: #4F4F4F;">Name: <strong>{{ $data['name'] }}</strong> <br></div>
                                                                                                </td>
                                                                                             </tr>
                                                                                             <tr>
                                                                                                <td align="left" class="link-wrap" style="font-family: Open Sans, Helvetica, Tahoma, Arial, sans-serif; font-size: 0px; padding: 0; padding-bottom: 20px; word-break: break-word;">
                                                                                                   <div style="font-family: Open Sans, Helvetica, Tahoma, Arial, sans-serif; font-size: 16px; font-weight: 300; line-height: 25px; text-align: left; color: #4F4F4F;">Contact: <strong>{{ $data['contact'] }}</strong> <br></div>
                                                                                                </td>
                                                                                             </tr>
                                                                                             <tr>
                                                                                                <td align="left" class="link-wrap" style="font-family: Open Sans, Helvetica, Tahoma, Arial, sans-serif; font-size: 0px; padding: 0; padding-bottom: 20px; word-break: break-word;">
                                                                                                   <div style="font-family: Open Sans, Helvetica, Tahoma, Arial, sans-serif; font-size: 16px; font-weight: 300; line-height: 25px; text-align: left; color: #4F4F4F;">Email: <strong>{{ $data['email'] }}</strong> <br></div>
                                                                                                </td>
                                                                                             </tr>
                                                                                             <tr>
                                                                                                <td align="left" class="link-wrap" style="font-family: Open Sans, Helvetica, Tahoma, Arial, sans-serif; font-size: 0px; padding: 0; padding-bottom: 20px; word-break: break-word;">
                                                                                                   <div style="font-family: Open Sans, Helvetica, Tahoma, Arial, sans-serif; font-size: 16px; font-weight: 300; line-height: 25px; text-align: left; color: #4F4F4F;">Contact: <strong>{{ $data['contact'] }}</strong> <br></div>
                                                                                                </td>
                                                                                             </tr>
                                                                                             <tr>
                                                                                                <td align="left" class="link-wrap" style="font-family: Open Sans, Helvetica, Tahoma, Arial, sans-serif; font-size: 0px; padding: 0; padding-bottom: 20px; word-break: break-word;">
                                                                                                   <div style="font-family: Open Sans, Helvetica, Tahoma, Arial, sans-serif; font-size: 16px; font-weight: 300; line-height: 25px; text-align: left; color: #4F4F4F;">Area: <strong>{{ $data['area'] }}</strong> <br></div>
                                                                                                </td>
                                                                                             </tr>
                                                                                          </table>
                                                                                       </td>
                                                                                    </tr>
                                                                                 </tbody>
                                                                              </table>
                                                                           </div>
                                                                           <!--[if mso | IE]> 
                                                                        </td>
                                                                     </tr>
                                                                  </table>
                                                                  <![endif]--> 
                                                               </td>
                                                            </tr>
                                                         </tbody>
                                                      </table>
                                                   </div>
                                                   <!--[if mso | IE]> 
                                                </td>
                                             </tr>
                                          </table>
                                       </td>
                                    </tr>
                                    <![endif]--> 
                                    <!--[if mso | IE]> 
                                 </table>
                                 <![endif]--> 
                              </td>
                           </tr>
                        </tbody>
                     </table>
                  </div>
                  <!--[if mso | IE]> 
               </td>
            </tr>
         </table>
         <![endif]--> <!-- footer start --> <!-- Footer Wrapper -->
         <div class="footer-wrapper" style="margin: 0px auto; max-width: 600px;">
            <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background-color: #FFFFFF; width: 100%;" width="100%" bgcolor="#FFFFFF">
               <tbody>
                  <tr>
                     <td style="direction:ltr;font-size:0px;padding:20px 0;text-align:center;">
                        <!--[if mso | IE]>
                        <table role="presentation" border="0" cellpadding="0" cellspacing="0">
                           <![endif]-->
                           <!-- footer information -->
                           <!--[if mso | IE]>
                           <tr>
                              <td class="footer-information-outlook" width="600px">
                                 <table align="center" border="0" cellpadding="0" cellspacing="0" class="footer-information-outlook" style="width:600px;" width="600">
                                    <tr>
                                       <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
                                          <![endif]--> 
                                          <div class="footer-information" style="margin:0px auto;max-width:600px;">
                                             <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background-color: #FFFFFF; width: 100%;" width="100%" bgcolor="#FFFFFF">
                                                <tbody>
                                                   <tr>
                                                      <td style="direction:ltr;font-size:0px;padding:0px;text-align:center;">
                                                         <!--[if mso | IE]>
                                                         <table role="presentation" border="0" cellpadding="0" cellspacing="0">
                                                            <tr>
                                                               <td class="" style="vertical-align:top;width:600px;">
                                                                  <![endif]-->
                                                                  <div class="column-per-100 outlook-group-fix" style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
                                                                     <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="background-color: #FFFFFF; vertical-align: top;" width="100%" valign="top" bgcolor="#FFFFFF">
                                                                        <tbody>
                                                                           <tr>
                                                                              <td align="center" style="font-size:0px;padding:10px 25px;word-break:break-word;">
                                                                                 <div style="font-family:OpenSans, Helvetica, Tahoma, Arial, sans-serif;font-size:12px;font-weight:400;line-height:20px;text-align:center;color:#4F4F4F;">
                                                                                    &copy; 2020-2021 Motherson Sumi Systems
                                                                                 </div>
                                                                              </td>
                                                                           </tr>
                                                                        </tbody>
                                                                     </table>
                                                                  </div>
                                                                  <!--[if mso | IE]>
                                                               </td>
                                                            </tr>
                                                         </table>
                                                         <![endif]-->
                                                      </td>
                                                   </tr>
                                                </tbody>
                                             </table>
                                          </div>
                                          <!--[if mso | IE]>
                                       </td>
                                    </tr>
                                 </table>
                              </td>
                           </tr>
                           <![endif]-->
                           <!-- footer logo -->
                           <!--[if mso | IE]>
                        </table>
                        <![endif]-->
                     </td>
                  </tr>
               </tbody>
            </table>
         </div>
         <!-- footer end --> 
      </div>
   </body>
</html>
Leave a Comment