Простая ajax подписка на рассылку в один клик

Часто на сайте для коммуникации с пользователями используется подписка на новости и конечно хочетсясделать процесс подписки удобным для пользователя , далее будет описан процесс создания простой ajaxподписки на новости для сайта на системе битрикс .

Первым делом мы подключим библиотеку jquery с гугла

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script> 

Далее мы создадим файл где будет наша форма подписки, я назвал его subscribe.php и разместил в папке/include/ajax/

<?
require($_SERVER["DOCUMENT_ROOT"]."/bitrix/modules/main/include/prolog_before.php");
CModule::IncludeModule("subscribe");
// если есть post запрос с почтой то исполняем код
if($_POST["email"]) {
    $EMAIL = $_POST["email"];
    /* получим значение пользователя */
    if ($USER->IsAuthorized()){
        global $USER;
        $USER = $USER->GetID() ;
    }
    else {
       $USER = NULL ;
    }
    /* определим рубрики активные рубрики подписок */
    $RUB_ID = array();
    $rub = CRubric::GetList(array(), array("ACTIVE"=>"Y"));
    while($rub->ExtractFields("r_")):
     $RUB_ID = array($r_ID) ;
    endwhile;
 
    /* создадим массив на подписку */
    $subscr = new CSubscription;
    $arFields = Array(
        "USER_ID" => $USER,
        "FORMAT" => "html/text",
        "EMAIL" => $EMAIL,
        "ACTIVE" => "Y",
        "RUB_ID" => $RUB_ID,
        "SEND_CONFIRM" => "N"
    );
    $idsubrscr = $subscr->Add($arFields);
 
    if($idsubrscr) {
      $popuptitle = '<span style="color: green">Удачно</span>';
      $popuptext =  $EMAIL .' подписан на рассылку';
    }
    else {
      $popuptitle = '<span style="color: red">Ошибка</span>';
      $popuptext =   $EMAIL .' уже был подписан на рассылку';
    }
    /* если ajax не подключен */
    if ($_POST["action"] != "ajax") {
       header('Location: '.$_SERVER['HTTP_REFERER']);
    }
}
 
?>
<? if($popuptitle || $popuptext):?>
<script type="text/javascript" >
$.gritter.add({
    title: '<? echo $popuptitle;?> ',
    text: '<? echo $popuptext;?> ',
    sticky: false,
    time: 2500
});
</script>
<? endif ;?>
 
<form action="/include/ajax/subscribe.php" name="subscribe"   method="post">
    <label>Подписаться на новости:</label>
    <input type="text" value="" title="Ваш e-mail" class="mailing-text" name="email"/> <br />
    <input type="submit" value="Подписаться" title="" class="mailing-submit" /><br />
</form>

Подключаемый скрипт необходим мне для всплывающего окошка для оповещения пользователя, взять скрипт можно тут

Теперь я подключу этот файл в шаблоне сайт с помощью компонента bitrix:main.include обернув в div с классом mailing

<div class="mailing">
                <?$APPLICATION->IncludeComponent(
                    "bitrix:main.include",
                    "",
                    Array(
                        "AREA_FILE_SHOW" => "file",
                        "PATH" => "/include/ajax/subscribe.php",
                        "EDIT_TEMPLATE" => ""
                    )
                );?>
            </div>

Последний шаг это создание скрипта для ajax обработки его назовем файл subscr.js подключим его в хэдере вот его содержимое

/* Function for ours ajax inquiry  */
function ajaxpostshow(urlres, datares, wherecontent){
       $.ajax({
           type: "POST",
           url: urlres,
           data: datares,
           dataType: "html",
           beforeSend: function(){
                var elementheight = $(wherecontent).height();
                $(wherecontent).prepend('<div class="ajaxloader"></div>');
                $('.ajaxloader').css('height', elementheight);
                $('.ajaxloader').prepend('<img class="imgcode" src="/js/ajax/ajax-loader.gif">');
            },
           success: function(fillter){
                $(wherecontent).html(fillter);
 
           }
      });
}
 
   /* For subscribe */
  $(".mailing form .mailing-submit").live("click",function(){
        var formsubscrube = $(this).parents("form").serialize();
        formsubscrube = formsubscrube + '&action=ajax';
        ajaxpostshow("/include/ajax/subscribe.php", formsubscrube, ".mailing" );
        return false;
   });

Вот собственно и все ajax подписка в один клик сделана, подписка будет идти на все разделы , в личном кабинете пользователь сможет отписаться от не нужного ему раздела .

Помогла заметка? Жмите кнопки ниже

Tweet