Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 15.08.2013, 23:05
Новичок на форуме
Отправить личное сообщение для miker059 Посмотреть профиль Найти все сообщения от miker059
 
Регистрация: 01.07.2013
Сообщений: 9

Ajax и отправка файлов с формы
Здравствуйте, Дорогие Форумчане!
Помогите, пожалуйста, разобраться.
Я в javascript силен не сильно, можно сказать почти 0, в основном если что то делаю то пользуюсь jQuery, но и в нем еще не очень)
Возникла у меня такая проблемка, есть у меня формочка обратной связи обычная, которая отправляет сообщения от пользователей ко мне на почту, происходит это через Ajax в php, все как обычно, и встала у меня необходимость, чтобы пользователи еще могли файлик прикладывать и вместе с сообщением мне на почту отсылать. Вставил я значит в форму строчку input type=file, в php дописал прицепление вложения к письму, и... без ajax все работает, а с ajax'ом не фига, вычитал что метод serialize, который передает данные формы, не передает данные о файле. Пытаюсь найти решение уже неделю но ни как не выходит.. Помогите решить проблемку, пожалуйста.

Вот то что у меня есть:
html:
<form id="commentForm" class="form" method="post" action enctype="multipart/form-data">
<fieldset>
<input type="text" placeholder="Имя:" value name="name">
<input id="email" type="text" placeholder="E-mail:" value name="email">
<label for="file">Приложите свое изображение:</label>
<input  id="file" type="file" value name="file">
<textarea placeholder="Ваши пожелания:" cols rows value name="message"></textarea>
</fieldset>
<input id="button" class="submit" type="submit" value="Отправить" name="submit">
</form>


ajax
jQuery(document).ready(function() {
	$("#commentForm").submit(function() { return false; });
				
	$("#button").on("click", function(){
		
		var emailval  = $("#email").val();
			var mailvalid = validateEmail(emailval);
			
			if(mailvalid == false) {
				$("#email").addClass("error");
			}
			else if(mailvalid == true){
				$("#email").removeClass("error");
			}
			
		if(mailvalid == true) {
			$(".submit").replaceWith("<div class='form_dscr'><p class='sending'>Отправка...</p></div>");
				
			$.ajax({
					type: 'POST',
					url: 'mail.php',
					data: $("#commentForm").serialize(),
					success: function(data) {
						if(data == "true") {
							$(".sending").replaceWith("<p>Принято!<p>");
							} else {
							$(".sending").replaceWith("<p>Ошибка! Обновите страницу...<p>");
							}
						}
				});
				}
			});
});


ну и mail.php
<?php
function mail_attachment($filename, $mailto, $from_mail, $from_name, $replyto, $subject, $message) 
{
    $file = $filename;
    $file_size = filesize($file);
    $handle = fopen($file, "r");
    $content = fread($handle, $file_size);
    fclose($handle);
    $content = chunk_split(base64_encode($content));
    $uid = md5(uniqid(time()));
    $name = basename($file);
    $header = "From: ".$from_name." <".$from_mail.">\r\n";
    $header .= "Reply-To: ".$replyto."\r\n";
    $header .= "MIME-Version: 1.0\r\n";
    $header .= "Content-Type: multipart/mixed; boundary=\"".$uid."\"\r\n\r\n";
    $header .= "This is a multi-part message in MIME format.\r\n";
    $header .= "--".$uid."\r\n";
    $header .= "Content-type:text/plain; charset=utf-8 \r\n";
    $header .= "Content-Transfer-Encoding: 7bit\r\n\r\n";
    $header .= $message."\r\n\r\n";
    $header .= "--".$uid."\r\n";
    $header .= "Content-Type: application/octet-stream; name=\"".$filename."\"\r\n"; 
    $header .= "Content-Transfer-Encoding: base64\r\n";
    $header .= "Content-Disposition: attachment; filename=\"".$filename."\"\r\n\r\n";
    $header .= $content."\r\n\r\n";
    $header .= "--".$uid."--";
    return mail($mailto, $subject, "", $header);     
}

$sendto   = "my@mail.ru"; 		
$username = $_POST['name'];
$useremail  = $_POST['email'];
$usermsg = $_POST['message'];
$subjectuser  = "Сообщение";
$headersuser  = "From: Сообщение\r\n";
$headersuser .= "Reply-To: ". strip_tags($username) . "\r\n";
$headersuser .= "MIME-Version: 1.0\r\n";
$headersuser .= "Content-Type: text/html;charset=utf-8 \r\n";
$my_file = "";
if (!empty($_FILES['file']['tmp_name'])) 
 {
$path = $_FILES['file']['name']; 
if (copy($_FILES['file']['tmp_name'], $path)) $my_file = $path; 
 }			
$my_name = "Письмо с блога"; 					
$my_mail = "my@mail.ru"; 						
$my_replyto = "my@mail.ru";
$my_message = "Имя: ".$username."\r\nЕ-mail: ".$useremail."\r\nСообщение: ".$usermsg."\r\n";

if(@mail_attachment($my_file, $sendto, $my_mail, $my_name, $my_replyto, $subjectuser, $my_message)){
		echo "true";
} else {
	echo "false";
}

?>
Ответить с цитированием
  #2 (permalink)  
Старый 16.08.2013, 00:43
без статуса
Отправить личное сообщение для Deff Посмотреть профиль Найти все сообщения от Deff
 
Регистрация: 25.05.2012
Сообщений: 8,220

miker059,
Для файлов аяксом serialize() - не проходит, курите FormData()
Ответить с цитированием
  #3 (permalink)  
Старый 16.08.2013, 00:47
Аватар для nerv_
junior
Отправить личное сообщение для nerv_ Посмотреть профиль Найти все сообщения от nerv_
 
Регистрация: 29.11.2011
Сообщений: 3,924

http://learn.javascript.ru/xhr-onpro...-и-формы
__________________
Чебурашка стал символом олимпийских игр. А чего достиг ты?
Тишина - самый громкий звук
Ответить с цитированием
  #4 (permalink)  
Старый 16.08.2013, 02:30
Новичок на форуме
Отправить личное сообщение для miker059 Посмотреть профиль Найти все сообщения от miker059
 
Регистрация: 01.07.2013
Сообщений: 9

Спасибо, ребят, помогло) получилось так

вот это:

$.ajax({
					type: 'POST',
					url: 'mail.php',
					data: $("#commentForm").serialize(),
					success: function(data) {
						if(data == "true") {
							$(".sending").replaceWith("<p>Принято!<p>");
							} else {
							$(".sending").replaceWith("<p>Ошибка! Обновите страницу...<p>");
							}
						}
				});


заменил на это:

var form = document.forms.commentForm;

			var formData = new FormData(form);  

			var xhr = new XMLHttpRequest();
			xhr.open("POST", "mail.php");

			xhr.onreadystatechange = function() {
				if (xhr.readyState == 4) {
					if(xhr.status == 200) {
						data = xhr.responseText;
						if(data == "true") {
							$(".sending").replaceWith("<p>Принято!<p>");
						} else {
							$(".sending").replaceWith("<p >Ошибка! Обновите страницу...<p>");
						}
					}
				}
			};
			
			xhr.send(formData);


теперь все работает, единственное как я понял метод FormData работает только на новых браузерах, хотя в принципе это не сильно важно. Еще раз спасибо!
Ответить с цитированием
  #5 (permalink)  
Старый 09.01.2018, 12:46
Новичок на форуме
Отправить личное сообщение для Rad Miru Посмотреть профиль Найти все сообщения от Rad Miru
 
Регистрация: 09.01.2018
Сообщений: 1

Благодарю за ваше решение.
Всё отлично работает в Chrome, Yandex и ДАЖЕ в IE но..
Firefox отказывается отсылать почту. Есть мнения на этот счёт?!
Ответить с цитированием
  #6 (permalink)  
Старый 10.01.2018, 03:12
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 11,399

Сообщение от Rad Miru
Firefox отказывается отсылать почту. Есть мнения на этот счёт?!
Ни один из перечисленных браузеров к почте не имеет отношения вообще, браузер отправляет только форму.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
отправка ajax формы iskander83 Элементы интерфейса 2 19.05.2013 16:33
Отправка формы по ENTER (ajax) и перенос строки VEGA jQuery 18 01.03.2013 13:09
Отправка данных формы AJAX`ом? Jopses jQuery 4 20.02.2013 11:34
Отправка формы по ENTER (ajax) byzyk jQuery 2 07.11.2012 17:03
Объясните как вызывается ajax скрипт AddressBook из формы prog90 AJAX и COMET 3 06.06.2009 16:12