电子邮件文件附件php,Ajax,Jquery

时间:2018-08-02 06:34:38

标签: javascript php jquery ajax email

我对以下代码的电子邮件文件附件php,Ajax,Jquery有问题,我还需要文件附件字段为必填项。表单中上传的文件不会传递到电子邮件!

我需要将代码放入Ajax以便从表单接收文件并检查空白字段,然后一切顺利,将包含文件的字段传递给表单。以及从表单到电子邮件。

HTML表单:

<form role="form">
                <div class="form-group">
                <label for="inputName" class="form-label "></label>
                <input type="text" class="form-control" id="inputName" placeholder="Enter your name"/>
                </div>
                <div class="form-group">
                    <label for="inputEmail" class="form-label "></label>
                    <input type="email" class="form-control" id="inputEmail" placeholder="Enter your email"/>
                </div>
                <div class="form-group">
                    <label for="inputMessage" class="form-label "></label>
                    <input type="text"  class="form-control"  id="inputMessage" placeholder="Phone Example:+1234567890"></textarea>
                </div>
            </form>


            <button type="button" class="btn sign-btn-primary submitBtn" onclick="submitContactForm()">Request</button>

        <p class="statusMsg"></p>

我的php文件:

// Submitted form data
$name   = $_POST['name'];
$email  = $_POST['email'];
$message= $_POST['message'];

/*
 * Send email to admin
 */
$to     = 'info@test.org';
$subject= 'CCI2017 Download Log';

$htmlContent = '
<h4>The CCI 2017 has been downloaded by person, details are given below.</h4>
<table cellspacing="0" style="width: 300px; height: 200px;">
    <tr>
        <th>Name:</th><td>'.$name.'</td>
    </tr>
    <tr style="background-color: #e0e0e0;">
        <th>Email:</th><td>'.$email.'</td>
    </tr>
    <tr>
        <th>Phone:</th><td>'.$message.'</td>
    </tr>
</table>';

// Set content-type header for sending HTML email
$headers = "MIME-Version: 1.0" . "\r\n";
$headers .= "Content-type:text/html;charset=UTF-8" . "\r\n";

// Additional headers
$headers .= 'From: ME' . "\r\n";

// Send email
if(mail($to,$subject,$htmlContent,$headers)){
    $status = 'ok';
}else{
    $status = 'err';
}

// Output status
echo $status;die;

}

我的jquery:

<script type="application/javascript">
    function submitContactForm() {
        var reg = /^[A-Z0-9._%+-]+@([A-Z0-9-]+\.)+[A-Z]{2,4}$/i;
        var regp = /^((\+\d{1,3}(-| )?\(?\d\)?(-| )?\d{1,5})|(\(?\d{2,6}\)?))(-| )?(\d{3,4})(-| )?(\d{4})(( x| ext)\d{1,5}){0,1}$/;
        var name = $('#inputName').val();
        var email = $('#inputEmail').val();
        var message = $('#inputMessage').val();
        if (name.trim() == '') {
            alert('Please enter your name.');
            $('#inputName').focus();
            return false;
        } else if (email.trim() == '') {
            alert('Please enter your email.');
            $('#inputEmail').focus();
            return false;
        } else if (email.trim() != '' && !reg.test(email)) {
            alert('Please enter valid email.');
            $('#inputEmail').focus();
            return false;
        } else if (message.trim() != '' && !regp.test(message)) {
            alert('Please enter your Phone.');
            $('#inputMessage').focus();
            return false;
        } else {
            $.ajax({
                type: 'POST',
                url: 'submit_form.php',
                data: 'contactFrmSubmit=1&name=' + name + '&email=' + email + '&message=' + message,
                beforeSend: function () {
                    $('.submitBtn').attr("disabled", "disabled");
                    $('.modal-body').css('opacity', '.5');
                },
                success: function (msg) {
                    if (msg == 'ok') {
                        $('#inputName').val('');
                        $('#inputEmail').val('');
                        $('#inputMessage').val('');
                        $('.statusMsg').html('<a href="Doc/MENACA CCI (c).pdf" class="btn cci-btn-primary btn-sm">Download</a>');
                    } else {
                        $('.statusMsg').html('<span style="color:red;">Some problem occurred, please try again.</span>');
                    }
                    $('.submitBtn').removeAttr("disabled");
                    $('.modal-body').css('opacity', '');
                }
            });
        }
    }

</script>

1 个答案:

答案 0 :(得分:0)

解决方案:

<form role="form">
    <div class="form-group">
        <label for="inputName" class="form-label "></label>
        <input type="text" class="form-control" id="inputName" placeholder="Enter your name"/>
    </div>
    <div class="form-group">
        <label for="inputEmail" class="form-label "></label>
        <input type="email" class="form-control" id="inputEmail" placeholder="Enter your email"/>
    </div>
    <div class="form-group">
        <label for="inputMessage" class="form-label "></label>
        <input type="text"  class="form-control"  id="inputMessage" placeholder="Phone Example:+1234567890"></textarea>
    </div>
</form>


<button type="button" class="btn sign-btn-primary submitBtn" onclick="submitContactForm()">Request</button>

<p class="statusMsg"></p>

<script src="https://code.jquery.com/jquery-1.10.2.js"></script>

<script type="application/javascript">
    function submitContactForm() {
        var reg = /^[A-Z0-9._%+-]+@([A-Z0-9-]+\.)+[A-Z]{2,4}$/i;
        var regp = /^((\+\d{1,3}(-| )?\(?\d\)?(-| )?\d{1,5})|(\(?\d{2,6}\)?))(-| )?(\d{3,4})(-| )?(\d{4})(( x| ext)\d{1,5}){0,1}$/;
        var name = $('#inputName').val();
        var email = $('#inputEmail').val();
        var message = $('#inputMessage').val();
        if (name.trim() == '') {
            alert('Please enter your name.');
            $('#inputName').focus();
            return false;
        } else if (email.trim() == '') {
            alert('Please enter your email.');
            $('#inputEmail').focus();
            return false;
        } else if (email.trim() != '' && !reg.test(email)) {
            alert('Please enter valid email.');
            $('#inputEmail').focus();
            return false;
        } else if (message.trim() != '' && !regp.test(message)) {
            alert('Please enter your Phone.');
            $('#inputMessage').focus();
            return false;
        } else {
            $.ajax({
                type: 'POST',
                url: 'submit_form.php',
                data: 'contactFrmSubmit=1&name=' + name + '&email=' + email + '&message=' + message,
                beforeSend: function () {
                    $('.submitBtn').attr("disabled", "disabled");
                    $('.modal-body').css('opacity', '.5');
                },
                success: function (msg) {
                    if (msg == 'ok') {
                        $('#inputName').val('');
                        $('#inputEmail').val('');
                        $('#inputMessage').val('');
                        $('.statusMsg').html('<a href="Doc/MENACA CCI (c).pdf" class="btn cci-btn-primary btn-sm">Download</a>');
                    } else {
                        $('.statusMsg').html('<span style="color:red;">Some problem occurred, please try again.</span>');
                    }
                    $('.submitBtn').removeAttr("disabled");
                    $('.modal-body').css('opacity', '');
                }
            });
        }
    }

</script>

Submit_form.php

<?php

// Submitted form data
$name   = $_POST['name'];
$email  = $_POST['email'];
$message= $_POST['message'];


$to = 'kiran.mind2014@gmail.com';

// Subject
$subject = 'CCI2017 Download Log';

// Message
$message = '
<h4>The CCI 2017 has been downloaded by person, details are given below.</h4>
<table cellspacing="0" style="width: 300px; height: 200px;">
    <tr>
        <th>Name:</th><td>'.$name.'</td>
    </tr>
    <tr style="background-color: #e0e0e0;">
        <th>Email:</th><td>'.$email.'</td>
    </tr>
    <tr>
        <th>Phone:</th><td>'.$message.'</td>
    </tr>
</table>
';

// To send HTML mail, the Content-type header must be set
$headers[] = 'MIME-Version: 1.0';
$headers[] = 'Content-type: text/html; charset=iso-8859-1';

// Additional headers
$headers[] = 'To: Kiran <kiran.mind2014@gmail.com>';
$headers[] = 'From: CCI2017 Download Log <kiran.mind2014@gmail.com>';

// Send email
if(mail($to, $subject, $message, implode("\r\n", $headers))){
$status = 'ok';
}else{
$status = 'err';
}

// Output status
echo $status;die;

一切正常!!