@ademar26

Как сделать уведомление об отправке почты?

Есть 2 файла, первый с формой посылает методом post данные в файл обработчика. Письма присылаются, но вот уведомление в окне никакого не происходит. Помогите решить проблемку
код формы
<div class="table-responsive"> <form  method="post" enctype="multipart/form-data" id="f01">
<table class="table">
<thead>
<tr class="active">
<th style="text-align: center;" colspan="2">Информация о заказчике</th>
</tr>
</thead>
<tbody>
<tr>
<td align="center">Адрес заказчика</td>
<td class="w40"><input name="addr" size="50" type="text" value="" /></td>
</tr>
<tr>
<td align="center">Контактное лицо</td>
<td><input name="pcont" size="50" type="text" placeholder="Обязательное поле" /></td>
</tr>
<tr>
<td align="center">Тел:</td>
<td><input name="phone" size="40" type="text" placeholder="Обязательное поле" /></td>
</tr>
<tr>
<td align="center">E-mail</td>
<td><input name="pmail" size="50" type="text" placeholder="Обязательное поле" /></td>
</tr>
</tbody>
</table>
<table class="table" style="margin: auto;" >
<thead>
<tr>
<th class="center" style="text-align: center;" colspan="4">ХАРАКТЕРИСТИКИ ПОМЕЩЕНИЯ, КВАРТИРЫ</th>
</tr>
</thead>
<tbody>
<tr>
<td colspan="2" align="center">Количество помещений, комнат:</td>
<td class="w40" colspan="2"><input name="shema_sist_ot" type="text" value="" /></td>
</tr>
<tr>
<td colspan="2" align="center">Площадь помещения, квартиры:</td>
<td class="w40" colspan="2"><input name="uzel" type="text" value="" /></td>
</tr>
<tr>
<td colspan="2" rowspan="2" align="center">Санузел</td>
<td align="center">раздельный</td>
<td align="center"><input name="kontur1_otopl_max" type="checkbox" value="раздельный" /></td>
</tr>
<tr>
<td align="center">совмещенный</td>
<td align="center"><input name="kontur1_otopl_min" type="checkbox" value="совмещенный" /></td>
</tr>
<tr>
<td class="w25" colspan="2" rowspan="2" align="center">Наличие балкона (лоджии)?</td>
<td align="center">да</td>
<td align="center"><input name="kontur1_vent_max" type="checkbox" value="да" /></td>
</tr>
<tr>
<td align="center">нет</td>
<td align="center"><input name="kontur1_vent_min" type="checkbox" value="нет" /></td>
</tr>
<tr>
<td class="w25" colspan="2" align="center">Выстота потолков</td>
<td class="w40" colspan="2"><input size="40" name="treb_tepl_mochn" type="text" value="" /></td>
</tr>
<tr>
<td class="w25" colspan="2" align="center">Требуется ли стяжка, штукатурка? (да/нет)</td>
<td class="w40" colspan="2"><input size="40" name="napr_seti" type="text" value="" /></td>
</tr>
<tr>
<td class="w25" colspan="2" align="center">Стоят ли счётчики на воду, газ, свет? (да/нет/частично)</td>
<td class="w40" colspan="2"><input size="40" name="marka_kotl" type="text" value="" /></td>
</tr>
<tr>
<td class="w25" colspan="2" align="center">Установка электрического теплого пола (требуется, не требуется):</td>
<td class="w40" colspan="2"><input size="40" name="marka_nasos" type="text" value="" /></td>
</tr>
</tbody>
</table>
<div align="center"><input class="red-btn" id="button1" type="submit" value="Отправить форму"></div>
</form></div>
<div id="form-bg"> </div>
<link href="/bootstrap/css/bootstrap.min.css" rel="stylesheet" media="screen" />
<style type="text/css">

.red-btn {
	margin-top: 30px;
	padding: 9px 26px;
	font-size: 18px;
	font-weight: bold;
	color: #fff;
	cursor: pointer;
	border-bottom: 3px solid #7a0013;
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
	border-radius: 2px;
	-moz-box-shadow: 0 2px 7px rgba(0,0,0, .4);
	-webkit-box-shadow: 0 2px 7px rgba(0,0,0, .4);
	box-shadow: 0 2px 7px rgba(0,0,0, .4);
	background: rgb(229,50,83); 
	background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2U1MzI1MyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUwJSIgc3RvcC1jb2xvcj0iI2UzMmU0YiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlMTJhNDYiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
	background: -moz-linear-gradient(top, rgba(229,50,83,1) 0%, rgba(227,46,75,1) 50%, rgba(225,42,70,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(229,50,83,1)), color-stop(50%,rgba(227,46,75,1)), color-stop(100%,rgba(225,42,70,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, rgba(229,50,83,1) 0%,rgba(227,46,75,1) 50%,rgba(225,42,70,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, rgba(229,50,83,1) 0%,rgba(227,46,75,1) 50%,rgba(225,42,70,1) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, rgba(229,50,83,1) 0%,rgba(227,46,75,1) 50%,rgba(225,42,70,1) 100%); /* IE10+ */
	background: linear-gradient(to bottom, rgba(229,50,83,1) 0%,rgba(227,46,75,1) 50%,rgba(225,42,70,1) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e53253', endColorstr='#e12a46',GradientType=0 ); /* IE6-8 */
}
.red-btn:hover {
	-moz-box-shadow: inset 0 5px 10px rgba(255,255,255, .3), inset 0 -2px 5px rgba(255,255,255, .2), 0 2px 7px rgba(0,0,0, .4);
	-webkit-box-shadow: inset 0 5px 10px rgba(255,255,255, .3), inset 0 -2px 5px rgba(255,255,255, .2), 0 2px 7px rgba(0,0,0, .4);
	box-shadow: inset 0 5px 10px rgba(255,255,255, .3), inset 0 -2px 5px rgba(255,255,255, .2), 0 2px 7px rgba(0,0,0, .4);
}
.red-btn:active {
	margin-top: 33px;
	-moz-box-shadow: inset 0 3px 3px rgba(0,0,0, .5);
	-webkit-box-shadow: inset 0 3px 3px rgba(0,0,0, .5);
	box-shadow: inset 0 3px 3px rgba(0,0,0, .5);
	border: none;
}

</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<script language="javascript" type="text/javascript">
// функция маски для input телефона
    
    // функция обработчик
    function AjaxFormRequest(result_id,form01,url) {
        jQuery.ajax({
            url:     url,
            type:     "POST",
            dataType: "html",
            data: jQuery("#"+form01).serialize(), 
            success: function(response) {
            document.getElementById(result_id).innerHTML = response;
        },
        error: function(response) {
        document.getElementById(result_id).innerHTML = "<p>Возникла ошибка при отправке формы. Попробуйте еще раз</p>";
        }
     });

     $(':input','#f01')
        .not(':button, :submit, :reset, :hidden')
        .val('')
        .removeAttr('checked')
        .removeAttr('selected');
    }
    document.getElementById('button1').onclick = function() {
        AjaxFormRequest('result_id', 'f01', 'mail_to.php')
    };  
    
	

</script>


Код обработчика
<?
   $to = 'remontir24@mail.ru';
   $subject = 'ЗАЯВКА С ОПРОСНОГО ЛИСТА '.$_SERVER['HTTP_REFERER'];
   $subject = "=?utf-8?b?". base64_encode($subject) ."?=";
   $message = "<center><b>Поступило обращение с сайта remontir24.ru <br /> по вопросу заказа работ</b></center>".
              "<br /><b>Адрес заказчика:</b> " .$_POST["addr"].
			  "<br /><b>Контактное лицо:</b> " .$_POST["pcont"].
			  "<br /><b>Тел:</b> " .$_POST["phone"].
			  "<br /><b>Email:</b> " .$_POST["pmail"].
			  "<br /><b>ХАРАКТЕРИСТИКИ ПОМЕЩЕНИЯ, КВАРТИРЫ</b> ".
			  "<br /><b>Количество помещений, комнат:</b> " .$_POST["shema_sist_ot"].
			  "<br /><b>Площадь помещения, квартиры:</b> " .$_POST["uzel"].
			  "<br /><b>Санузел</b> " .$_POST["kontur1_otopl_max"]. $_POST["kontur1_otopl_min"].
			  "<br /><b>Наличие балкона (лоджии)?</b> " .$_POST["kontur1_vent_max"]. $_POST["kontur1_vent_min"]. 
   			  "<br /><b>Выстота потоков</b> " .$_POST["treb_tepl_mochn"].
			  "<br /><b>Требуется ли стяжка, штукатурка?</b> " .$_POST["napr_seti"].
			  "<br /><b>Стоят ли счётчики на воду, газ, свет?</b> " .$_POST["marka_kotl"].
			  "<br /><b>Установка электрического теплого пола</b> " .$_POST["marka_nasos"];
   $headers = 'Content-type: text/html; charset="utf-8"';
   $headers .= "MIME-Version: 1.0\r\n";
   $headers .= "Date: ". date('D, d M Y h:i:s O') ."\r\n";
  $phone = $_POST["phone"];
  $pmail = $_POST["pmail"];
   if (empty($phone) or empty($pmail)) {
   echo 'Форма не заполнена!';
} else {
   mail($to, $subject, $message, $headers);
   echo 'Форма отправлена!';
}
   

?>
  • Вопрос задан
  • 111 просмотров
Решения вопроса 1
У вас в коде не видно элемента с id result_id.
Видимо, тут ошибка: AjaxFormRequest('result_id', 'f01', 'mail_to.php')
Такие вещи отлично решаются с помощью дебага в браузере (Sources в Хроме, Debugger в Firefox). Ставите брекпойнт, пошагово двигаетесь и смотрите на всё подозрительное через watch expression.
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы