work@lienusowl.ru

Полное портфолио: zsws.ru

Форма обратной связи ajax + прикрепление файлов

html код формы:


Вы можете присоединить необходимые файлы:

Подключаем javascript код для обработки отправки письма:

    
    

Код скрипта обработчика:

	// этот участок кода нужен только для отображения гифки
    // которая даёт пользователю понять, что что-то происходит
    // и нужно подождать
    $(document).ready(function () {
        $(document).ajaxStart(function () {
            // найдем элемент с изображением загрузки и уберем невидимость:
            var imgObj = $("#load-indicator");
            imgObj.show();
            // вычислим в какие координаты нужно поместить изображение загрузки,
            // чтобы оно оказалось в серидине страницы:
            var centerY = $(window).scrollTop() + ($(window).height() + imgObj.height()) / 2;
            var centerX = $(window).scrollLeft() + ($(window).width() + imgObj.width()) / 2;
            imgObj.offset({
                left: centerX,
                top: centerY
            });
        });
        //скрываем изображение после окончания AJAX-запроса
        $(document).ajaxStop(function () {
            $('#load-indicator').hide();
        });
    });
 
    // назначаем действие на такое событие как отправка формы
    $('#feedback').submit(function (evtObj) {
        evtObj.preventDefault();
        // Если элемент формы fileforsending содержит значения (т.е. выбран файл для отправки),
        // то вместо AJAX-запроса используем FormData()
        // поскольку файлы через AJAX-запросы не передаются                
 
        if (document.getElementById("feedback").fileforsending.value !== '') {
            //показываем гифку ожидания
            var imgObj = $("#load-indicator");
            imgObj.show();
            var centerY = $(window).scrollTop() + ($(window).height() + imgObj.height()) / 2;
            var centerX = $(window).scrollLeft() + ($(window).width() + imgObj.width()) / 2;
            imgObj.offset({
                left: centerX,
                top: centerY
            });
            // этот кусок кода я спёр отсюда http://javascript.ru/forum/jquery/40698-ajax-i-otpravka-fajjlov-s-formy.html
            var form = document.forms.feedback;
            var formData = new FormData(form);
            var xhr = new XMLHttpRequest();
            xhr.open("POST", "order.php");
            xhr.onreadystatechange = function () {
                if (xhr.readyState == 4) {
                    if (xhr.status == 200) {
                        data = xhr.responseText;
                        $("#result").html('Результат выполнения: ' + data);
                        // Письмо отправлено, сбрасываем данные формы если прошло успешно
                        if (data === 'Отправлено письмо с вложениями.') {
                            document.getElementById("feedback").reset();
                        }
                        //убираем гифку ожидания
                        $('#load-indicator').hide();
                    }
                }
            };
            xhr.send(formData);
            // В противном случае (не прикреплён файл для отправки)
            // Делаем AJAX-запрос для отправки письма
        } else {
            var form = $(this);
            $.ajax({
                // Здесь файл, который обрабатывает полученные от пользователя данные и отправляет почту
                url: 'order.php',
                type: 'POST',
                data: form.serialize(),
                // Действия в случае успешной отправки AJAX-запроса (а не письма!)
                // Здесь data - полученное от order.php сообщение
                success: function (data) {
                    if (data === 'Письмо отправлено.') {
                        $("#result").html('Письмо отправлено.');
                        // Письмо отправлено, сбрасываем данные формы
                        document.getElementById("feedback").reset();
                        // Следующая строка после успешной отправки сообщения
                        // перенаправляет пользователь на любую страницу/сайт
                        // достаточно раскомментировать её и поменять адрес сайта webware.biz
                        // на ваш собственный
                        //document.location.href = 'http://webware.biz';
                    } else {
                        $("#result").html(data);
                    }
                },
                error: function (data) {
                    $("#result").html('Результат выполнения: ' + data);
                }
            });
        }
    });

Код обработчика order.php:

	";
    $headers[] = "Bcc: JJ Chong ";
    $headers[] = "Reply-To: Recipient Name ";
    $headers[] = "Subject: {$subject}";
    $headers[] = "X-Mailer: PHP/" . phpversion();
    // собираем текст письма
    $allmsg = "

E-mail: $email

Имя: $name

"; $allmsg = "Обратная связь" . $allmsg . ""; // отправляем if (!mail($to, $subject, $allmsg, implode("\r\n", $headers))) { echo 'Письмо не отправлено - что-то не сработало.'; } else { echo 'Письмо отправлено.'; } } else { // эта часть кода отвечает за отправку сообщений с вложениями // читаем отправляемый файл в строку $fp = fopen($the_file, "r"); if (!$the_file) { die("Ошибка отправка письма: Файл $the_file не может быть прочитан."); } $file = fread($fp, filesize($path)); fclose($fp); // удаляем временный файл unlink($path); // собираем текст письма $allmsg = "

E-mail: $email

Имя: $name

"; $allmsg = "Обратная связь" . $allmsg . ""; // генерируем разделитель $boundary = "--" . md5(uniqid(time())); // собираем заголовки $headers = array(); $headers[] = "MIME-Version: 1.0"; $headers[] = "From: $name <$email>"; $headers[] = "Bcc: JJ Chong "; $headers[] = "Reply-To: Recipient Name "; $headers[] = "Subject: {$subject}"; $headers[] = "X-Mailer: PHP/" . phpversion(); $headers[] = "Content-Type: multipart/mixed; boundary=\"$boundary\"\n"; // собираем текст письма + приложенынй файл $multipart = array(); $multipart[] = "--$boundary"; $multipart[] = "Content-Type: text/html; charset=UTF-8"; $multipart[] = "Content-Transfer-Encoding: Quot-Printed\r\n"; $multipart[] = "$allmsg\r\n"; $multipart[] = "--$boundary"; $multipart[] = "Content-Type: application/octet-stream"; $multipart[] = "Content-Transfer-Encoding: base64"; $multipart[] = "Content-Disposition: attachment; filename = \"" . $path . "\"\r\n"; $multipart[] = chunk_split(base64_encode($file)); $multipart[] = "--$boundary"; // отправляем if (!mail($to, $subject, implode("\r\n", $multipart), implode("\r\n", $headers))) { echo 'Письмо не отправлено - что-то не сработало.'; } else { echo 'Отправлено письмо с вложениями.'; } } ?>