启用js文件时,联系表单不会发送所有表单详细信息

时间:2014-10-01 11:44:28

标签: javascript php html ajax forms

我的申请表发送,我能够收到用户插入的所有信息。但是,在集成下面的ajax脚本时,表单无法从表单中发送所有值,即EMAIL ADDRESS,FIRSTNAME,LASTNAME和NOTES。换句话说,我只在电子邮件中收到AGE,GENDER,EDUCATION和SPECIALIZATION字段值。

ajax脚本验证字段并序列化表单的输入并最终发送成功消息。

请找到文件: 的 contact.php

<form id="apply_form" method="post" action="Processor.php">
    <input type="text" name="applyEmail" id="applyEmail" class="requiredField email" />
    <input type="text" name="applyFirstName" id="applyFirstName" class="requiredField" />
    <input type="text" name="applyLastName" id="applyLastName" class="requiredField" />
    <div class="clearfix">
        <select name="applyAge" id="applyAge" class="requiredField" >
            <option value="age">age</option>
            <option value="18-24">18 - 24</option>
            <option value="25-34">25 - 34</option>
            <option value="35 and over">35 and over</option>
        </select>
    </div>
    <select name="applyGender" id="applyGender" class="requiredField" >
        <option value="gender"><?php echo _("Gender"); ?>*</option>
        <option value="male"><?php echo _("Male"); ?></option>
        <option value="female"><?php echo _("Female"); ?></option>
    </select>
   <div class="clearfix">
    <select name="applySpecialization" id="applySpecialization" class="requiredField" >
       <option value="specialization">specialization</option>
       <option value="beauty">beauty</option>
       <option value="makeup">makeup></option>
        <option value="studies">studies</option>
        <option value="art">art</option>
        <option value="theatre">theatre</option>
    </select>
</div>
<div class="clearfix">
    <select name="applyEducation" id="applyEducation" class="requiredField" >
        <option value="education">education</option>
        <option value="basic">basic</option>
        <option value="high">high</option>
        <option value="polytechnic">poly</option>
        <option value="masters">masters</option>
    </select>
</div>
<div class="clearfix">
    <textarea name="applyNotes" id="applyNotes" cols="25" rows="8"></textarea>
</div>
<input type="submit" id="sendApplication" name="sendApplication" value="Apply" />

ajax.js

if ($("#apply_form")[0]) {
        $('#apply_form').submit(function () {
            $('#apply_form .error').remove();
            $('.requiredField').removeClass('fielderror');
            $('.requiredField').addClass('fieldtrue');
            $('#apply_form span strong').remove();
            var hasError = false;
            $('#apply_form .requiredField').each(function () {
                if (jQuery.trim($(this).val()) === '') {
                    var labelText = $(this).prev('label').text();
                    $(this).addClass('fielderror');
                    $('#apply_form span').html('<strong>*Please fill out all fields.</strong>');
                    hasError = true;
                } else if ($(this).hasClass('email')) {
                    var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;
                    if (!emailReg.test(jQuery.trim($(this).val()))) {
                        var labelText = $(this).prev('label').text();
                        $(this).addClass('fielderror');
                        $('#apply_form span').html('<strong>Your email address is incorrect</strong>');
                        hasError = true;
                    }
                }
            });
            if (!hasError) {

                $.ajax({
                    url: 'applyProcess.php',
                    type: "POST",
                    data: {
                        "applyFirstName" : $('#applyFirstName').val(),
                        "applyLastName" : $('#applyLastName').val(),
                        "applyEmail" : $('#applyEmail').val(),
                                                                                                "applyAge" : $('#applyAge').val(),
                                                                                                "applyGender" : $('#applyGender').val(),
                                                                                                "applySpecialization" : $('#applySpecialization').val(),
                                                                                                "applyEducation" : $('#applyEducation').val(),
                        "applyNotes" : $('#applyNotes').val(),
                        "sendApplication" : true
                    }
                }).done(function(rsp) {
                    $('#sendApplication').attr('disabled', 'disabled');
                    $('#apply_form').fadeOut(500);
                    $('.contact-success').fadeIn(500);
                }).fail(function() {
                    $('#apply_form').fadeOut(500);
                    $('.contact-fail').fadeIn(500);
                });
            }
            return false;
        });
    }

processor.php

<?php

include 'library.php'; // include the library file
include "classes/class.phpmailer.php"; // include the class name

if(isset($_POST['sendApplication'])) {
    $email = $_POST['applyEmail'];
    $fname = $_POST['applyFirstName'];
    $lname = $_POST['applyLastName'];   
    $selected_val_age = $_POST['applyAge'];    
    $selected_val_gender = $_POST['applyGender'];    
    $selected_val_specialization = $_POST['applySpecialization'];    
    $selected_val_education = $_POST['applyEducation'];
    $notes = $_POST['applyNotes'];

    function clean_string($string) {
    $bad = array("content-type","bcc:","to:","cc:","href");
    return str_replace($bad,"",$string);
    }


    $email_message = "Applicant's Details.\n\n";
    $email_message = "<table>";
    $email_message .= "First Name: ".clean_string($fname)."\n";
    $email_message .= "Surname: ".clean_string($lname)."\n";
    $email_message .= "Email: ".clean_string($email)."\n";
    $email_message .="Age: ".clean_string($selected_val_age)."\n";
    $email_message .= "Gender: ".clean_string($selected_val_gender)."\n";
    $email_message .= "Specialization: ".clean_string($selected_val_specialization)."\n";
    $email_message .= "Education Level Attained: ".clean_string($selected_val_education)."\n";
    $email_message .= "About Applicant: ".clean_string($notes)."\n";
    $email_message .= "</table>";


    $mail = new PHPMailer();
    $mail->IsSMTP();
    $mail->SMTPDebug  = 2;
    $mail->Host       = SMTP_HOST;
    $mail->Port = SMTP_PORT; //Port of the SMTP like to be 25, 80, 465 or 587
    $mail->Username   = SMTP_UNAME;
    $mail->Password = SMTP_PWORD; 
    $mail->SMTPAuth   = true;
    $mail->FromName = $lname.' '.$fname;
    $mail->From = $email;  //From address of the mail
    $mail->Subject = ("Application Form"); //Subject of your mail
    $mail->AddAddress("me@me.com");
    $mail->AddCC("me@you.com");
    $mail->AddReplyTo("me@me.com", "Man");
    //Read an HTML message body from an external file, convert referenced images to embedded, convert HTML into a basic plain-text alternative body
    $mail->Body = $email_message;
    $mail->AltBody = $email_message;

    $send = $mail->Send(); //Send the mails


}
?>

我无法弄清楚为什么ajax脚本不会处理所有其他值,尽管它会执行其他所有操作(甚至返回成功消息。) 任何帮助将受到高度赞赏。致谢

2 个答案:

答案 0 :(得分:0)

您正在序列化表单,丢弃数据并尝试手动重新创建数据。不要这样做,只需发送序列化数据:

var formInput = $(this).serialize();
$.ajax({
     url: 'applyProcess.php',
     type: "POST",
     data: formInput,
     ...

答案 1 :(得分:0)

事实证明,我使用的是两个相同的表格ID。更改表单的ID名称后,一切都有效。