Post Form Data using Angularjs and PhpMailer

Question

I have established a contact form on my website(built usng angularjs) and now trying to post data using phpmailer. Unfortunately, I am stucked. While clicking on send button, I am facing 500 Internal Server Error in the console. I tried clearing cache, cookies and reloading the page but it's still the same. I don't understand what am I missing. Here's my code :

Contact.html

  <form class="form-inline" ng-submit="processForm()">
       <div id="name-group" class="form-group" ng-class="{ 'has-error' : errorName }">
         <input name="name" type="text" class="form-control" placeholder="Name" ng-model="formData.name">
         <span class="help-block" ng-show="errorName"></span>
       </div>
      <div class="form-group" id="superhero-group" ng-class="{ 'has-error' : errorSuperhero }">
         <input name="email" type="email" class="form-control" placeholder="Email">
      </div>
         <textarea name="message" class="form-control" rows="7" placeholder="Your message"></textarea>
         <button type="submit" name="submit" class="btn btn-default">Send</button>
   </form>

Index.php

 <?php
       require_once('pages/class.phpmailer.php');
       $errors = array();   // array to hold validation errors
       $data = array(); // array to pass back data
                       // validate the variables ======================================================
        if (empty($_POST['name']))
            $errors['name'] = 'Name is required.';
        if (empty($_POST['superheroAlias']))
            $errors['superheroAlias'] = 'E-mail is required.';
    // return a response ===========================================================
        // response if there are errors
        if ( ! empty($errors)) {
            // if there are items in our errors array, return those errors
            $data['success'] = false;
            $data['errors']  = $errors;

        } else {
            $mail = new PHPMailer(); // create a new object
            $mail->IsSMTP(); // enable SMTP
            $mail->SMTPAuth = true; // authentication enabled
            $mail->SMTPSecure = 'ssl'; // secure transfer enabled REQUIRED for GMail
            $mail->Host = "smtp.gmail.com";
            $mail->Port = 465; // or 587
            $mail->IsHTML(true);
            $mail->Username = "abc@gmail.com"; //Email that you setup
            $mail->Password = "12345"; // Password
            $mail->Subject = "Y-Web Contact mail from " . $_POST['name'] . ", e-mail: " .$_POST['superheroAlias']. "";
            $mail->Body = $_POST['content'];
            $mail->AddAddress("abc@gmail.com"); //Pass the e-mail that you setup
             if(!$mail->Send())
                {
                        echo "Mailer Error: " . $mail->ErrorInfo;
                }
                else
                {
                    $data['success'] = true;
                    $data['message'] = 'Thank you for sending e-mail.';
                }

        }
        echo json_encode($data);
  ?>

contactController.js

var GrapevineApp = angular.module('GrapevineApp');
GrapevineApp.controller('contactController', function($scope, $http) {

    // create a blank object to hold our form information
        // $scope will allow this to pass between controller and view
        $scope.formData = {};

        // process the form
        $scope.processForm = function () {
            $http({
                method: 'POST',
                url: 'pages/index.php',
                data: $.param($scope.formData),  // pass in data as strings
                headers: { 'Content-Type': 'application/x-www-form-urlencoded' }  // set the headers so angular passing info as form data (not request payload)
            })
                .success(function (data) {
                    console.log(data);

                    if (!data.success) {
                        // if not successful, bind errors to error variables
                        $scope.errorName = data.errors.name;
                        $scope.errorSuperhero = data.errors.superheroAlias;
                    } 
                    else {
                        // if successful, bind success message to message
                        $scope.message = data.message;

                    }
                });

        };  
});

Answer 1

I would bet that you've based your code on an obsolete PHPMailer example, but you're using a more recent version of PHPMailer itself, and since you're not following the advice in the readme, it's failing to find the SMTP class, resulting in an error 500.

You need to read how to do basic debugging in PHP, and look for the errors in your web server logs. If you don't have access to logs (i.e. You're on cheap shared hosting), you can ini_set('display_errors', true); temporarily.