Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
  • Sign Up

JavaScript форма (SweetAlert) + JSON + отправка сообщения с данными из формы. Застрял)


Recommended Posts

Добрый день коллеги, помогите разобраться.

 

Придумал себе задачу, сделать JS форму на сайте типа "Письмо директору", с двумя инпутами и кнопкой "ОК". При заполнении полей и нажатии на кнопку должна происходить отправка имейл сообщения.

 

Почему именно JS , потому что все всплывающие окошки на сайте сделаны через SweetAlert2. 

Форму сделал соответственно тоже через SweetAlert2, при заполнении полей и нажатии на OK данные с инпутов кодируются в JSON, тут всё работает.

 

Вот так выглядит форма:

 

 

<script type="text/javascript">
  window.onload = function () {
    var a = document.getElementById('director');
    a.onclick = function() {
        Swal({
          type: 'warning',
          title: 'Письмо директору',
          html:
            '<input id="swal-input1" class="swal2-input" placeholder="Ваш иемйл">' +
            '<textarea id="swal-textarea1" class="swal2-textarea" placeholder="Введите текст сообщения..." style="display: flex;"></textarea>',          
          showCancelButton: true,
          confirmButtonText: 'Отправить',
          cancelButtonText: 'Отмена',
          preConfirm: function () {
            return new Promise(function (resolve) {
              resolve([
                $('#swal-input1').val(),
                $('#swal-textarea1').val()
              ])
            })
          },                    
        }).then(function (result) {
          var message = JSON.stringify(result);
        })

        return false;
    }
}
</script>

 

 

Собственно, вопрос , а дальше что? Я начал лепить аджакс запрос:

 

          $.ajax({
              url:"sendmail.php",
              type: 'POST',
              data: message,
              error: true,
              success:function(message){swal('success')},
            })
        })

Результат приходит как succes. Создал sendmail.php файл:

 

<?php

	$message = $_POST['message'];

	$mail = new \Mail();
	$mail->protocol = $this->config->get('config_mail_protocol');
	$mail->parameter = $this->config->get('config_mail_parameter');
	$mail->smtp_hostname = $this->config->get('config_mail_smtp_hostname');
	$mail->smtp_username = $this->config->get('config_mail_smtp_username');
	$mail->smtp_password = html_entity_decode($this->config->get('config_mail_smtp_password'), ENT_QUOTES, 'UTF-8');
	$mail->smtp_port = $this->config->get('config_mail_smtp_port');
	$mail->smtp_timeout = $this->config->get('config_mail_smtp_timeout');

	$mail->setTo('director@mail.ru'); // Кому
	$mail->setFrom($this->config->get('config_email')); // От кого
	$mail->setSubject("Test mail"); // Тема
	$mail->setHtml($message); // Текст
	$mail->send();

?>

И тут у меня возникла мысль, что я вообще не той дорогой иду)) 

 

Уважаемые коллеги, направьте меня на правильный путь. 

Правильно ли я понял схему, сначала делаю форму, затем формирую ajax запрос в файл sendmail.php, а там ловлю json данные и произвожу отправку? 

 

 

Link to post
Share on other sites

13 минут назад, triok сказал:

И тут у меня возникла мысль, что я вообще не той дорогой иду)) 

 

:)

 

старайтесь придерживаться стандартов движка

как пример - посмотрите как сделана отправка комментария на странице товара, и делайте по аналогии

 

Link to post
Share on other sites

Если долго мучиться, то что-нибудь получится. В итоге все сделал. Может кому понадобится, оставлю код здесь. Надеюсь кто-нибудь опытный поправит кои косяки и недоработки.

 

В общем повторю еще раз смысл:

 

В шапке магазина размещена ссылка, нажав на которую появляется модальное окошко SweetAlert с формой (имя, имейл, текст). Заполнив форму, жмем "ОК" и происходит отправка сообщения с данными формы на определенный имейл. В моем случае на почту директора.

 

Итак,

в header.tpl, ссылка выглядит так:

<a href="mailto:director@xxx.ru"><p id="director" class="director">Письмо директору</p></a>

В footer.tpl, вставил скрипт JS(SweetAlert) + отправку формы через Ajax, json

<script type="text/javascript">
  window.onload = function () {
    var a = document.getElementById('director');
    a.onclick = function() {
        Swal({
          type: 'warning',
          title: 'Письмо директору',
          html:
            '<input name="name" id="swal-input1" class="swal2-input" placeholder="Ваше имя">' +
            '<input name="email" id="swal-input2" class="swal2-input" placeholder="Email для ответа">' +
            '<textarea name="text" id="swal-textarea1" class="swal2-textarea" placeholder="Введите текст сообщения..." style="display: flex;"></textarea>', 
          showCancelButton: true,
          confirmButtonColor: '#ff5908',
          cancelButtonColor: '#666',
          confirmButtonText: 'Далее',
          cancelButtonText: 'Отмена',
          preConfirm: function () {
            return new Promise(function (resolve) {
              resolve([
                $('#swal-input1').val(),
                $('#swal-input2').val(),
                $('#swal-textarea1').val()
              ])
            })
          },                    
        }).then(function (result) {
        var result = {};
        result.name = $('#swal-input1').val();
        result.email = $('#swal-input2').val(); 
        result.text = $('#swal-textarea1').val();         
          $.ajax({
              url:"/catalog/controller/common/director/index",
              type: "POST",
              data: JSON.stringify(result),
              error: function(xhr,status,error){
              console.log(status);
              console.log(error);
              }
            }).done(function() {
            Swal({type: 'success', text: 'Сообщение отправлено'});
          });
        })

        return false;
    }
}
</script>

 В папке controller/common/ создал контроллер director.php, который получает данные jSON и отправляет сообщение.

 

Вот так он выглядит: 

<?php
class ControllerCommonDirector extends Controller {

		public function index() {

		$request_body = file_get_contents('php://input');
		$data = json_decode($request_body);

		$username = $data->name;
		$email = $data->email;
		$msg = $data->text;
		$message = '<div><span>Имя: </span><span><strong>'.$username.'</strong></span></div><br><div><span>Имейл: </span><span><strong>'.$email.'</strong></span></div><br><div>Текст сообщения:</div><br><div><strong>'.$msg.'</strong><div>';
		$subject = 'Письмо директору от: '.$email;

		$mail = new Mail();

		$mail->protocol = $this->config->get('config_mail_protocol');
		$mail->parameter = $this->config->get('config_mail_parameter');
		$mail->smtp_hostname = $this->config->get('config_mail_smtp_hostname');
		$mail->smtp_username = $this->config->get('config_mail_smtp_username');
		$mail->smtp_password = html_entity_decode($this->config->get('config_mail_smtp_password'), ENT_QUOTES, 'UTF-8');
		$mail->smtp_port = $this->config->get('config_mail_smtp_port');
		$mail->smtp_timeout = $this->config->get('config_mail_smtp_timeout');

		$mail->setTo('director@xxx.ru'); // Имейл директора
		$mail->setFrom($this->config->get('config_email'));
		$mail->setSender(html_entity_decode($this->config->get('config_name'), ENT_QUOTES, 'UTF-8'));
		$mail->setSubject(html_entity_decode($subject, ENT_QUOTES, 'UTF-8'));
		$mail->setHtml($message);
		$mail->send();

    }			
}

 

 

Уверен, что можно было бы где-то что-то упростить, но вариант рабочий. Буду рад услышать критику.

Link to post
Share on other sites

Никакой защиты от спама

 

		$request_body = file_get_contents('php://input');
		$data = json_decode($request_body);

хм..

Link to post
Share on other sites

1) Немного переделал форму, так как если поля не заполнить и закрыть ее все равно появлялось уведомление что письмо отправлено. Поправил это. Новый код:

 

<script type="text/javascript">
  window.onload = function () {
    var a = document.getElementById('director');
    a.onclick = function() {
        Swal({
          type: 'warning',
          title: 'Письмо директору',
          html:
            '<input name="name" id="swal-input1" class="swal2-input" placeholder="Ваше имя">' +
            '<input name="email" id="swal-input2" class="swal2-input" placeholder="Email для ответа">' +
            '<textarea name="text" id="swal-textarea1" class="swal2-textarea" placeholder="Введите текст сообщения..." style="display: flex;"></textarea>',          
          showCancelButton: true,
          confirmButtonColor: '#ff5908',
          cancelButtonColor: '#666',
          confirmButtonText: 'Далее',
          cancelButtonText: 'Отмена',
          preConfirm: function () {
            return new Promise(function (resolve) {
              resolve([
                $('#swal-input1').val(),
                $('#swal-input2').val(),
                $('#swal-textarea1').val()
              ])
            })
          },                    
        }).then(function (result) {
        	if (result.value) { 
		        var result = {};
		        result.name = $('#swal-input1').val();
		        result.email = $('#swal-input2').val(); 
		        result.text = $('#swal-textarea1').val();         
	          	$.ajax({
	              url:"index.php?route=common/director/index",
	              type: "POST",
	              data: JSON.stringify(result),
	              success: function() {Swal({type: 'success', text: 'Сообщение отправлено'});},
	              error: function(xhr,status,error){
	              console.log(status);
	              console.log(error);
	              }
	            })
        	}
        })

        return false;
    }
}
</script>

 

2) Вопрос к знатокам, с точки зрения более  чистого кода уместно ли было создать новый контроллер для обработки такого запроса. Или же логичнее было впихнуть функцию обработки например в контроллер хедера/футера? 

Может быть вообще правильнее было всю логику вставить в функцию индекс хэдера/футера? 

 

3) 

 

11 часов назад, chukcha сказал:

Никакой защиты от спама

 


		$request_body = file_get_contents('php://input');
		$data = json_decode($request_body);

хм..

 

Защиту от спама не делал, во-первых не знаю как, а во-вторых на моем проекте она не нужна, спама нет)  
А вот с file_get_contents , тут да. Я долго не мог поймать пост запрос и в итоге это единственное решение которое сработало.

Был бы признателен если бы указали как правильнее его поймать. 

Я так понимаю что надо начать со строк:
if ($this->request->server['REQUEST_METHOD'] == 'POST') {

 

}

но как тут правильно все сделать не понимаю, у меня ничего не получилось

Edited by triok
Link to post
Share on other sites

26 минут назад, triok сказал:

Я так понимаю что надо начать со строк:

Как бы ... Вы отправляете json и решение верное, но проверить бы REQUEST_METHOD - неужели нет POST?

Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    No registered users viewing this page.

×
×
  • Create New...

Important Information

On our site, cookies are used and personal data is processed to improve the user interface. To find out what and what personal data we are processing, please go to the link. If you click "I agree," it means that you understand and accept all the conditions specified in this Privacy Notice.