PHP获取的简单AngularJs联系表:意外请求:POST contact-form.php

时间:2017-04-17 15:32:43

标签: php angularjs forms

我从未创建过AngularJs个联系表单,并在网上尝试了几个不同的示例。在所有示例中都没有提到错误:Unexpected request: POST contact-form.php(或者php文件被命名的任何内容)(尽管有一些帖子涉及"意外请求",但这些似乎大概是$httpBackend或其他主题),或者需要dependencies等的任何其他injected

注意:我使用的是常规,开箱即用的网络托管服务。

如果你能给我一些关于我为什么会收到这个错误,或许我做错了什么,以及其他任何有用的提示,我将不胜感激。

以下是我的controller代码:

(function () {
    "use strict";

    angular
        .module("impi-app")
        .controller("ContactController",

        ["$scope", "$filter", "$http", '$location',

            ContactController]);

    function ContactController($scope, $filter, $http, $location) {

        $scope.title = "Contact";

        $scope.formData = {};

        $scope.submit = function (contactForm) {
            $scope.result = 'hidden'
            $scope.resultMessage;
            $scope.formData; //formData is an object holding the name, email, subject, and message
            $scope.submitButtonDisabled = false;
            $scope.submitted = false; //used so that form errors are shown only after the form has been submitted
            $scope.submit = function (contactform) {
                $scope.submitted = true;
                $scope.submitButtonDisabled = true;
                if (contactform.$valid) {
                    $http({
                        method: 'POST',
                        url: 'contact-form.php',
                        data: $.param($scope.formData),  //param method from jQuery
                        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) { //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 = 'Failed :( Please fill out all the fields.';
                    $scope.result = 'bg-danger';
                }
            }
        }
    }
}());

这是我的联系人视图:

<div class="vertical-middle">
    <div class="container">
        <div class="panel panel-default">
            <div class="panel-heading">
                <h2 class="panel-title">Contact Form</h2>
            </div>
            <div ng-controller="ContactController" class="panel-body">
                <form ng-submit="submit(contactform)" name="contactform" method="post" action="" class="form-horizontal" role="form">
                    <div class="form-group" ng-class="{ 'has-error': contactform.inputName.$invalid && submitted }">
                        <label for="inputName" class="col-lg-2 control-label">Name</label>
                        <div class="col-lg-10">
                            <input ng-model="formData.inputName" type="text" class="form-control" id="inputName" name="inputName" placeholder="Your Name" required>
                        </div>
                    </div>
                    <div class="form-group" ng-class="{ 'has-error': contactform.inputEmail.$invalid && submitted }">
                        <label for="inputEmail" class="col-lg-2 control-label">Email</label>
                        <div class="col-lg-10">
                            <input ng-model="formData.inputEmail" type="email" class="form-control" id="inputEmail" name="inputEmail" placeholder="Your Email" required>
                        </div>
                    </div>
                    <div class="form-group" ng-class="{ 'has-error': contactform.inputSubject.$invalid && submitted }">
                        <label for="inputSubject" class="col-lg-2 control-label">Subject</label>
                        <div class="col-lg-10">
                            <input ng-model="formData.inputSubject" type="text" class="form-control" id="inputSubject" name="inputSubject" placeholder="Subject Message" required>
                        </div>
                    </div>
                    <div class="form-group" ng-class="{ 'has-error': contactform.inputMessage.$invalid && submitted }">
                        <label for="inputMessage" class="col-lg-2 control-label">Message</label>
                        <div class="col-lg-10">
                            <textarea ng-model="formData.inputMessage" class="form-control" rows="4" id="inputMessage" name="inputMessage" placeholder="Your message..." required></textarea>
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-lg-offset-2 col-lg-10">
                            <button type="submit" class="btn btn-default" ng-disabled="submitButtonDisabled">
                                Send Message
                            </button>
                        </div>
                    </div>
                </form>
                <p ng-class="result" style="padding: 15px; margin: 0;">{{ resultMessage }}</p>
            </div>
        </div>
    </div>
</div>

这是我的contact-form.php

<?php
error_reporting(E_ALL);
ini_set('display_errors', '1');
require_once 'phpmailer/PHPMailerAutoload.php';

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

    //create an instance of PHPMailer
    $mail = new PHPMailer();

    $mail->From = $_POST['inputEmail'];
    $mail->FromName = $_POST['inputName'];
    $mail->AddAddress('onmyway.whatever@outlook.com'); //recipient 
    $mail->Subject = $_POST['inputSubject'];
    $mail->Body = "Name: " . $_POST['inputName'] . "\r\n\r\nMessage: " . stripslashes($_POST['inputMessage']);

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

    $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);

}

非常感谢。

1 个答案:

答案 0 :(得分:0)

尝试在 contact-form.php

之前添加斜杠
    private FirebaseAuth.AuthStateListener mAuthListener;

// ...

@Override
protected void onCreate(Bundle savedInstanceState) {
    // ...
    mAuthListener = new FirebaseAuth.AuthStateListener() {
        @Override
        public void onAuthStateChanged(@NonNull FirebaseAuth firebaseAuth) {
            FirebaseUser user = firebaseAuth.getCurrentUser();
            if (user != null) {
                // User is signed in
                Log.d(TAG, "onAuthStateChanged:signed_in:" + user.getUid());
            } else {
                // User is signed out
                Log.d(TAG, "onAuthStateChanged:signed_out");
            }
            // ...
        }
    };
    // ...
}

@Override
public void onStart() {
    super.onStart();
    mAuth.addAuthStateListener(mAuthListener);
}

@Override
public void onStop() {
    super.onStop();
    if (mAuthListener != null) {
        mAuth.removeAuthStateListener(mAuthListener);
    }
}