我在联系表单中有一个ng-select,我可以正确接收ng-select以外的表单。
系统仅向我返回“ array”一词,但我需要从ng-select中选择选项。
这是我的HTML部分
<div ng-controller="ContactController" class="panel-body">
<form ng-submit="submit(contactform)" name="contactform" method="post" action="" class="form-horizontal" role="form">
<div class="row half" ng-class="{ 'has-error': contactform.inputName.$invalid && submitted }">
<div class="12u">
<input ng-model="formData.inputName" type="text" class="form-control" id="inputName" name="inputName" placeholder="Nombre" required>
</div>
</div>
<div class="row half" ng-class="{ 'has-error': contactform.inputEmail.$invalid && submitted }">
<div class="12u">
<input ng-model="formData.inputEmail" type="email" class="form-control" id="inputEmail" name="inputEmail" placeholder="Email de contacto" required>
</div>
</div>
<!-- select -->
<div class="row half" ng-class="{ 'has-error': contactform.myDepartment.$invalid && submitted }">
<div class="12u">
<select ng-model="formData.myDepartment" ng-options="departamento.name for departamento in departamento" id="myDepartment" name="myDepartment">
<option value="">-- Tipo de mensaje --</option>
</select>
</div>
</div>
<!-- select -->
<div class="row half" ng-class="{ 'has-error': contactform.inputSubject.$invalid && submitted }">
<div class="12u">
<input ng-model="formData.inputSubject" type="text" class="form-control" id="inputSubject" name="inputSubject" placeholder="Asunto del mensaje" required>
</div>
</div>
<div class="row half" ng-class="{ 'has-error': contactform.inputMessage.$invalid && submitted }">
<div class="12u">
<textarea ng-model="formData.inputMessage" class="form-control" rows="4" id="inputMessage" name="inputMessage" placeholder="Mensaje" required></textarea>
</div>
</div>
<div class="row">
<div class="12u">
<input type="submit" name="submit" id="submit_btn" value="Enviar mensaje" ng-disabled="submitButtonDisabled"/>
</div>
</div>
</form>
<p ng-class="result" style="padding: 15px; margin: 0;">{{ resultMessage }}</p>
</div>
这是controller.js的代码
app.controller('ContactController', function ($scope, $http) {
$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.departamento = [
{name:'Selecciona departamento'},
{name:'RRHH'},
{name:'Soporte'},
{name:'Postventa'},
{name:'Comercial'},
{name:'Desarrollo'}
];
$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';
$scope.myDepartment = $scope.departamento.name; // red
} 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';
}
}
});
这是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['myDepartment']) && isset($_POST['inputSubject']) && isset($_POST['inputMessage'])) {
//check if any of the inputs are empty
if (empty($_POST['inputName']) || empty($_POST['inputEmail']) || empty($_POST['myDepartment']) || empty($_POST['inputSubject']) || empty($_POST['inputMessage'])) {
$data = array('success' => false, 'message' => 'Completa el formulario antes de enviar');
echo json_encode($data);
exit;
}
//create an instance of PHPMailer
$mail = new PHPMailer();
$mail->From = $_POST['inputEmail'];
$mail->FromName = $_POST['inputName'];
$mail->AddAddress('[email protected]'); //recipient
$mail->Subject = $_POST['inputSubject'];
$mail->Body = "Name: " . $_POST['inputName'] . "\r\n\r\nDepartment: " . $_POST['myDepartment'] . "\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' => 'El mensaje no puede ser enviado. Error: ' . $mail->ErrorInfo);
echo json_encode($data);
exit;
}
$data = array('success' => true, 'message' => 'Gracias, hemos recibido tu mensaje.');
echo json_encode($data);
} else {
$data = array('success' => false, 'message' => 'Rellena el formulario completamente.');
echo json_encode($data);
}
你能帮助我吗?
谢谢,路易吉
javascript大神给出的解决方案
您需要为$ scope.myDepartment设置整个对象。代替
ng-options="departamento.name for departamento in departamento"
尝试使用
ng-options="departamento.name as departamento.name for departamento in departamento"
这应将$ scope.myDepartment设置为所选的实际字符串,而不是{name:selection}对象
如何防止SQL使用单引号字符存储转义字符 - javascript我需要存储在开头和结尾都带有单引号的文本字符串。我正在从PHP发布JavaScript命令。我将引号添加到这样的字符串中:echo '<script type="text/javascript">'; echo 'function GetCodes() {'; echo 'va…
执行onclick时获得意外令牌 - javascript我正在使用onclick事件从PHP调用JS函数。这是我的代码:我在一个函数中,因此我需要通过PHP来完成它,因为然后我会返回:$html = '<input type="checkbox" checked value="1" id="setGetSku" name="se…
Ajax功能后没有数据传递到URL - javascript这是我使用Ajax将参数传递到另一个PHP页面的脚本。 $(document).on( "click",".btndriver", function() { var id = $(this).attr("id"); var nombre = $(this).attr("nombre…
如果复选框切换复选框已选中,则在切换div中输入必填字段 - javascript我使用脚本用JavaScript切换了一些div。如果要选中复选框以显示toogle div,我想在toogle div中设置一些“必填”输入字段。有人能弄清楚吗?那是工作吗?function show(id) { if(document.getElementById) { var mydiv = document.getElementById(id); m…
通过相同的ID名称分配和获取值 - javascript我正在使用x-editable http://vitalets.github.io/x-editable/index.html jQuery Inplace编辑器。目前,我有一个如下的工作代码:<?php $num_rows = 1; // store the record of the "tblstudent" table int…