Подписка на рассылку без перезагрузки страницы (ajax) — различия между версиями

Материал из Umicms
Перейти к:навигация, поиск
 
 
(не показана 1 промежуточная версия 1 участника)
Строка 28: Строка 28:
 
function getResult( result ){
 
function getResult( result ){
 
responses = {"%subscribe_subscribe%": "Вы подписались на рассылку",
 
responses = {"%subscribe_subscribe%": "Вы подписались на рассылку",
"%subscribe_incorrect_email%": "Извините, Вы указали некорректный E-mail."};
+
    "%subscribe_incorrect_email%": "Извините, Вы указали некорректный E-mail.",
 +
                                    "%subscribe_unsubscribed_ok%": "Вы успешно отписались от рассылки.",
 +
                                    "%subscribe_unsubscribed_failed%": "Не удалось отписаться от рассылки."};
 
var result_node = result["result"];
 
var result_node = result["result"];
 
if (result_node["class"] && result_node["class"] === "error"){
 
if (result_node["class"] && result_node["class"] === "error"){
Строка 53: Строка 55:
 
<form action="/dispatches/subscribe_do/" name="sbs_frm" method="post" onsubmit="sbs_frm_send(this);return false;">
 
<form action="/dispatches/subscribe_do/" name="sbs_frm" method="post" onsubmit="sbs_frm_send(this);return false;">
 
</source>
 
</source>
 +
 +
Примечание: для использования данного скрипта в tpl-шаблонизаторе, следует заменить спец символы "&amp;amp;" на "&"

Текущая версия на 14:37, 5 ноября 2015

Задача: Реализовать подписку на рассылку посетителей сайта без перезагрузки страницы с помощью ajax.

Реализация: В шаблон подписки на рассылку, по которому обрабатываются результаты работы макроса dispatches subscribe(), добавим JavaScript код для отправки ajax запросов:

<script src="/js/jquery/jquery.jgrowl_minimized.js"></script>
<link rel="/js/jquery/jquery.jgrowl.css"/>
<script>
	function sbs_frm_send( form ){
		var request_url = "/udata://dispatches/subscribe_do/.json";
		var email = $("input[name='sbs_mail']", form);
		var params = {"sbs_mail" : email.val()};
		$.ajax({
			type: "POST",
			url: request_url,
			data: params,
			dataType: "json",
		})
		.done(function( result ) {
			getResult(result);
		})
		.fail(function( result ) {
			jQuery.jGrowl('Возникла ошибка при выполнении запроса.', {
						  'header': 'UMI.CMS - Ошибка',
						  'life': 10000
			});
		});
		
		function getResult( result ){
			responses = {"%subscribe_subscribe%": "Вы подписались на рассылку",
				     "%subscribe_incorrect_email%": "Извините, Вы указали некорректный E-mail.",
                                     "%subscribe_unsubscribed_ok%": "Вы успешно отписались от рассылки.",
                                     "%subscribe_unsubscribed_failed%": "Не удалось отписаться от рассылки."};
			var result_node = result["result"];
			if (result_node["class"] &amp;&amp; result_node["class"] === "error"){
				jQuery.jGrowl( responses[result_node["node"]], {
							   'header': 'UMI.CMS - ошибка',
							   'life': 10000
				});
				email.focus();
			}else{
				jQuery.jGrowl( responses[result_node], {
							   'header': 'UMI.CMS',
							   'life': 10000
				});
			}
			
		}
		
	}
</script>

Тег <form> подписки на рассылку должен выглядеть следующим образом:

<form action="/dispatches/subscribe_do/" name="sbs_frm" method="post" onsubmit="sbs_frm_send(this);return false;">

Примечание: для использования данного скрипта в tpl-шаблонизаторе, следует заменить спец символы "&amp;" на "&"