PHP Angular JS联系表格不会发布

时间:2016-04-12 08:10:31

标签: javascript php angularjs forms

我一直在"请完整填写表格!"错误,当试图发布到我的PHP表单。

The error I get when I try to submit my contact form 这是我的角度

  var app = angular.module('app', ['ngRoute']);

    app.config(['$routeProvider',
      function($routeProvider) {
        $routeProvider
          .when('/home', {
            templateUrl: 'pages/partial.home.html',
            controller: 'homecontroller'
          })
          .when('/about', {
            templateUrl: 'pages/partial.about.html',
            controller: 'aboutcontroller'
          })
          .when('/services', {
            templateUrl: 'pages/partial.services.html',
            controller: 'servicecontroller'
          })
          .when('/contact', {
            templateUrl: 'pages/partial.contact.html',
            controller: 'contactcontroller'
          })
          .when('/portfolio', {
            templateUrl: 'pages/partial.portfolio.html',
            controller: 'portfoliocontroller'
          });

        /* .otherwise({
        templateUrl:'pages/partial.404.html'
       });*/

      }
    ]);
    app.controller('homecontroller', ['$scope', '$http',
      function($scope, $http) {
        $scope.title = 'About Us';
      }
    ]);

    app.controller('aboutcontroller', ['$scope', '$http',
      function($scope, $http) {
        $scope.title = 'About Us';

      }
    ]);
    app.controller('servicecontroller', ['$scope', '$http',
      function($scope, $http) {
        $scope.title = 'Our Services';

      }
    ]);
    app.controller('contactcontroller', ['$scope', '$http',
      function($scope, $http) {
        $scope.resultMessage;
        $scope.result = 'hidden';
        $scope.formData; //formData is an object holding the name, email, subject, and message
        $scope.submitButtonDisabled = false;
        $scope.submitted = false;
        $scope.submit = function(contactform) {
          $scope.submitted = true;
          $scope.submitButtonDisabled = true;
          if (contactform.$valid) {
            $http({
              method: 'POST',
              url: 'bin/contact_form.php',
              data: $.param($scope.formData), //param method from jQuery
              headers: {
                'Content-Type': 'application/x-www-form-urlenconded'
              }

            }).success(function(data) {
              console.log(data);
              if (data.success) { //success comes from the return json object
                $scope.submitButtonDisabled = true;
                $scope.resultMessage = data.message;
                $scope.result = 'bg-success';
              } else {
                $scope.submitButtonDisabled = false;
                $scope.resultMessage = data.message;
                $scope.result = 'bg-danger';

              }
            });
          } else {
            $scope.submitButtonDisabled = false;
            $scope.resultMessage = 'Oops, Failed to send!';
            $scope.result = 'bg-danger';
          }
        }

      }
    ]);

    app.controller('portfoliocontroller', ['$scope', '$http',
      function($scope, $http) {
        $scope.title = 'Our portfolio';
  }
]);

这里是我的PHP代码

    <?php
error_reporting(E_ALL);
ini_set('display_errors', '0');
require 'class.phpmailer.php'; //include phpmailer



if (isset($_POST['inputName']) && isset($_POST['inputEmail']) && isset($_POST['inputSubject']) && isset($_POST['inputMessage'])) {

    //check if any of the inputs are empty
    if (empty($_POST['inputName']) || empty($_POST['inputEmail']) || empty($_POST['inputSubject']) || empty($_POST['inputMessage'])) {
        $data = array('success' => false, 'message' => 'Please fill out the form completely.');
        echo json_encode($data);
        exit;
    }
    $usermail = $_POST['inputEmail']; //get sender mail address
    $sender = $_POST['inputName']; // get sender Name
    $from  = "*@gmail.com"; //SMTP mail address
    $mail = new PHPMailer(); 
    $mail->IsSMTP(true);     // use SMTP ?
    $mail->IsHTML(false);   // use HTML emails ?
    $mail->SMTPAuth   = true;   // enable SMTP authentication
    $mail->SMTPSecure = 'ssl'; // secure transfer enabled
    $mail->Host       = "smtp.gmail.com"; //mail server Host
    $mail->Port       =  465;                    // set the SMTP port
    $mail->Username   = "*@gmail.com";  // SMTP  username
    $mail->Password   = "******";  // SMTP password                

    $mail->SetFrom($from, 'Contact Form'); //
    $mail->AddReplyTo($usermail, $sender); // set reply to sender

        $mail->AddAddress('*@gmail.com','***'); //recipient email address

        $mail->Subject = $_POST['inputSubject'];
        $mail->Body = "Name: " . $_POST['inputName'] . "\r\n\r\n Email: ".$_POST['inputEmail']."\r\n\r\nMessage: " . stripslashes($_POST['inputMessage']);
        $mail->WordWrap = 50;


    if (isset($_POST['ref'])) {
        $mail->Body .= "\r\n\r\nRef: " . $_POST['ref'];
    }

    if(!$mail->Send()) {
        $data = array('success' => false, 'message' => 'Message could not be sent. Mailer Error: ' . $mail->ErrorInfo);
        echo json_encode($data);
        exit;
    } else {

    $data = array('success' => true, 'message' => 'Thanks! We have received your message.');
    echo json_encode($data);
    }

} else {

    $data = array('success' => false, 'message' => 'Please fill out the form completely.');
    echo json_encode($data);

}
?>

2 个答案:

答案 0 :(得分:0)

我热烈建议你不要在Angularjs中使用JQuery。

发生这种情况是因为您没有正确发送表单参数,请尝试将数据更改为以下内容:

$http({
    method: 'POST',
    url: 'bin/contact_form.php',
    data: $scope.formData, 
    headers: {
       'Content-Type': 'application/x-www-form-urlenconded'
    }}).success ....

我希望它有所帮助。

答案 1 :(得分:0)

我以这种方式进行Ajax调用,将数据发布为json:

在控制器中:

$http.post('bin/contact_form.php', $scope.formData).success(function(data) {
    console.log(data);
});

在您的PHP文件中:

$form = json_decode(file_get_contents("php://input"));

if ( $form->inputName ... )

修改 $http.post()只是普通$http方法的快捷方式,但默认情况下Content-Type设置为application/json。在php中你将通过上面的代码获得json对象。对我来说,输入而不是$_POST[...]更好。