反馈表单jQuery不返回任何数据

时间:2015-02-27 19:43:09

标签: php jquery html ajax phpmailer

我有一个带有ajax查询到php文件的html页面。这个php文件应该发送一条消息,然后向ajax查询提供一个响应。但是,无论我做什么,我都无法通过此ajax调用获得任何响应。我做错了什么?

HTML:

<form id="feedback-form" method="post">
<table border="0" cellpadding="3">
<tr>
<td><h4>Name: </h4></td>
<td><input type="text" id="name"></input></td>
</tr>
<tr>
<td><h4>Company: </h4></td>
<td><input type="text" id="company_name"></input></td>
</tr>
<tr>
<td><h4>Email: </h4></td>
<td><input type="text" id="email"></input></td>
</tr>
<tr>
<td><h4>Feedback Category: </h4></td>
<td>
<select id="category">
<option class="placeholder" selected disabled>Select Category</option>
<option value="website">Site Issue</option>
<option value="content">Content Issue</option>
<option value="suggestion">Content Suggestion</option>
</select>
</td>
</tr>
<tr>
<td><h4>Message: </h4>(include as much detail as possible)</td>
<td><textarea id="message" style="resize: none;" rows="5"></textarea></td>
</tr>
<tr>
<td><h4>Attachment: </h4>(include any material relevant to your request)</td>
<td><input type="file" id="files" multiple></input></td>
</tr>
<tr>
<td><input type="submit" value="Send"></input></td>
</tr>
</table>
</form>
<span id="feedbackResponse"></span>

JS:

$('#feedback-form').on('submit', function (e) {
          e.preventDefault();

          $.ajax({
            type: 'POST',
            url: '/RK/sendFeedback.php',
            data: $('#feedback-form').serialize(),
            success: function (response) {
              $('#feedbackResponse').html(response);
        },
            error: function (response) {
              $('#feedbackResponse').html(response);
            }
          });

        });

PHP:

<?php
require '/RK/PHPMailerAutoload.php';

$mail = new PHPMailer;

$mail->isSMTP();                                      // Set mailer to use SMTP
$mail->Host = '******.100';                       // Specify main and backup server
$mail->SMTPAuth = true;                               // Enable SMTP authentication
$mail->Username = 'email@email.com';                   // SMTP username
$mail->Password = 'password';               // SMTP password
$mail->SMTPSecure = 'tls';                            // Enable encryption, 'ssl' also accepted
$mail->Port = 587;                                    //Set the SMTP port number - 587 for authenticated TLS
$mail->setFrom('email@email.com', 'DataMotion Wiki');     //Set who the message is to be sent from
$mail->addReplyTo('email@email.com', 'No Reply');  //Set an alternative reply-to address
$mail->addAddress('email@email.com', 'No Reply');  // Add a recipient
$mail->WordWrap = 50;                                 // Set word wrap to 50 characters

$mail->isHTML(true);                                  // Set email format to HTML

$mail->Subject = 'DataMotion Wiki Feedback';
$mail->Body    = '<b>From:</b> '.$_POST['email'].'<br/><b>Category:</b> .$_POST['category'].<br/><b>Message:</b> .$_POST['message']
 echo 'Just before sending';
if(!$mail->send()) {
   echo 'Message could not be sent.';
   echo 'Mailer Error: ' . $mail->ErrorInfo;
   exit;
}

echo 'Thank you for your feedback. Your message has been sent';
?>

1 个答案:

答案 0 :(得分:1)

也许,您的JS代码放在表单上方。因此,在这种情况下,您需要将其包装到ready函数中,因为反馈形式在您的JS现在不存在。因此,您的代码正在尝试处理不存在的元素。 Ready函数仅在加载DOM后才能运行所有内容

所以,这对你有用

$(function(){
        $('#feedback-form').on('submit', function(e) {
            e.preventDefault();
            $.ajax({
                type: 'POST',
                url: 'sendFeedback.php',
                data: $('#feedback-form').serialize(),
                success: function (response) {
                    $('#feedbackResponse').html(response);
                },
                error: function (response) {
                    $('#feedbackResponse').html(response);
                }
            });

        });
    });

另外,在表单中添加method =“POST”,因为GET为default form method