JQuery联系表格

时间:2012-05-01 11:57:04

标签: php jquery

我一直在制作Net Tuts教程,为我的网站创建一个联系表格。链接以下教程:

http://net.tutsplus.com/tutorials/javascript-ajax/submit-a-form-without-page-refresh-using-jquery/

我有它的功能但是已经涉及到在注释表单中添加其他字段的方法。所有其他字段都提交到两个电子邮件地址(我的网站电子邮件和发件人也可以复制),但评论字段仍然显示“未输入评论”

我的表格代码如下:

[contact.php page]

<div id="content">
<div id="contact_form">
    <div class="padding">
<h2>Contact Me</h2>
<p>If you would like to contact me regarding a quote or indeed anything relating to the website
please use the form below and I will get to you as soon as possible. Thanks!</p>
<form name="contact" method="post" action="">
   <fieldset>
     <label for="name" id="name_label">Name</label>
     <input type="text" name="name" id="name" size="30" value="" class="text-input" />
     <label class="error" for="name" id="name_error">This field is required.</label><br />

     <label for="email" id="email_label">Return Email</label>
     <input type="text" name="email" id="email" size="30" value="" class="text-input" />
     <label class="error" for="email" id="email_error">This field is required.</label><br />

     <label for="phone" id="phone_label">Return Phone</label>
     <input type="text" name="phone" id="phone" size="30" value="" class="text-input" />
     <label class="error" for="phone" id="phone_error">This field is required.</label><br />


     <label for="comment" id="comment_label">Comment</label>
     <textarea name="comments" rows="10" cols="30" ></textarea>
     <input type="text" name="comment" id="comment" size="300" value="" class="text-input" />
     <label class="error" for="comment" id="comment_error">This field is required.</label><br />
     <input type="submit" name="submit" class="button" id="submit_btn" value="Send" />
   </fieldset>
 </form>    
    </div>
</div>
</div>

[process.php]

   <?php
if ((isset($_POST['name'])) && (strlen(trim($_POST['name'])) > 0)) {
    $name = stripslashes(strip_tags($_POST['name']));
} else {$name = 'No name entered';}
if ((isset($_POST['email'])) && (strlen(trim($_POST['email'])) > 0)) {
    $email = stripslashes(strip_tags($_POST['email']));
} else {$email = 'No email entered';}
if ((isset($_POST['phone'])) && (strlen(trim($_POST['phone'])) > 0)) {
    $phone = stripslashes(strip_tags($_POST['phone']));
} else {$phone = 'No phone entered';}
if ((isset($_POST['comment'])) && (strlen(trim($_POST['comment'])) > 0)) {
    $comment = stripslashes(strip_tags($_POST['comment']));
} else {$comment = 'No comment entered';}
ob_start();
?>
<html>
<head>
<style type="text/css">
</style>
</head>
<body>
<table width="550" border="1" cellspacing="2" cellpadding="2">
  <tr bgcolor="#eeffee">
    <td>Name</td>
    <td><?=$name;?></td>
  </tr>
  <tr bgcolor="#eeeeff">
    <td>Email</td>
    <td><?=$email;?></td>
  </tr>
  <tr bgcolor="#eeffee">
    <td>Phone</td>
    <td><?=$phone;?></td>
  </tr>
   <tr bgcolor="#eeffee">
    <td>Comment</td>
    <td><?=$comment;?></td>
   </tr>
</table>
</body>
</html>
<?php
$body = ob_get_contents();

$to = '';
$email = '';
$fromaddress = "";
$fromname = "Online Contact";
$test = $comment;

require("phpmailer.php");

$mail = new PHPMailer();

$mail->From     = $_POST['email'];
$mail->FromName = "Contact Form";
$mail->AddAddress("contact@ncwebcreative.co.uk","Name 2");


$mail->WordWrap = 50;
$mail->IsHTML(true);

$mail->Subject  =  "Contact form submitted";
$mail->Body     =  $body;
$mail->AltBody  =  "This is the text-only body";

if(!$mail->Send()) {
    $recipient = 'your_email@example.com';
    $subject = 'Contact form failed';
    $content = $body;
  mail($recipient, $subject, $content, "From: mail@yourdomain.com\r\nReply-To: $email\r\nX-Mailer: DT_formmail");
  exit;
}
?>

2 个答案:

答案 0 :(得分:0)

尝试摆脱这一行:

<input type="text" name="comment" id="comment" size="300" value="" class="text-input" />

文本区域内有文本输入字段。您可能需要根据代码的其余部分将id="comment"添加到文本区域。

同时更改文本区域名称以进行评论。

答案 1 :(得分:0)

需要更改代码:

$("input#comment").focus();

$("textarea#comment").focus();

能够使用带有jquery的文本区域

非常感谢