我已经使用AngularJS构建了一个联系表单并使用了PHP。表格工作正常,我能够收到电子邮件。但是,在提交表单后,我想禁用提交按钮并显示成功消息,反之亦然。
我的代码如下:
var app = angular.module('myApp', ['jcs-autoValidate']);
app.run(['defaultErrorMessageResolver',
function(defaultErrorMessageResolver) {
defaultErrorMessageResolver.getErrorMessages().then(function (errorMessages) {
errorMessages['validPhone'] = 'Please enter valid phone number';
});
}]);
app.controller('FormController', function($scope, $http){
$scope.formData = {};
$scope.result = 'hidden'
$scope.submitButtonDisabled = false;
$scope.submitted = false;
$scope.submit = function(help) {
$http({
method : 'POST',
url : 'process.php',
data : $.param($scope.formData),
headers : {'Content-Type': 'application/x-www-form-urlencoded'}
}) .success(function(data) {
console.log(data);
if (data.success) {
$scope.submitButtonDisabled = true;
$scope.resultMessage = data.message;
$scope.result = 'bg-sucess';
} else {
$scope.submitButtonDisabled = false;
$scope.resultMessage = data.message;
$scope.result = 'bg-danger';
}
});
}
});
PHP
<?php
require_once 'phpmailer/PHPMailerAutoload.php';
if (isset($_POST['name']) && isset($_POST['email']) && isset($_POST['phone']) && isset($_POST['message'])) {
if (empty($_POST['name']) || empty($_POST['email']) || empty($_POST['phone']) || empty($_POST['message'])) {
$data = array('success' => false, 'message' => 'Please the form completely.');
echo json_encode($data);
exit;
}
$mail = new PHPMailer();
$mail->From = $_POST['email'];
$mail->FromName = $_POST['name'];
$mail->AddAddress('xxxx@gmail.com');
$mail->Subject = $_POST['phone'];
$mail->Body = "Name: " . $_POST['name'] . "\r\n\r\nMessage: " . stripslashes($_POST['message']);
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' => 'Thank you for contacting us! We will get back to you soon.');
echo json_encode($data);
} else {
$data = array('success' => false, 'message' => 'Please the form completely.');
echo json_encode($data);
}
CONSOLE:
{“成功”:是的,“消息”:“感谢您与我们联系!我们会尽快回复您。”}
您还可以访问演示链接以获取更多信息 http://newangularform.comlu.com/
感谢您提前提供任何帮助