PHP Angular JS联系人表单将't张贴

PHP Angular JS contact form wouldn't post

本文关键字:张贴 Angular JS 联系人 表单 PHP      更新时间:2024-05-02

当我试图发布到我的php表单时,我一直收到"请完整填写表单!"错误。

当我尝试提交联系表格时出现的错误这是我的角度

  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);
}
?>

我强烈建议不要将JQuery与Angularjs一起使用。

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

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

我希望它能有所帮助。

我用这种方式进行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 ... )

edit:$http.post()只是普通$http方法的快捷方式,但默认情况下Content-Type设置为application/json。在php中,您将通过上面的代码获得json对象。对我来说,打字比$_POST[...]好。