Не нравятся результаты поиска? Попробуйте другой поиск!
dle-faq.ru FAQ (все вопросы) Общие вопросы по вёрстке Постраничная навигация на ajax

Постраничная навигация на ajax


     03.04.2014    Общие вопросы по вёрстке, jQuery    2706

вопрос
Доброго времени суток, господа!
Подскажите пожалуйста, как можно поменять стандартную постраничную навигацию DLE, на ajax?
Точный пример здесь.

Постраничная навигация на ajax

Комментарии пользователей (24)

budda555
19 | 9

budda555 - 3 апреля 2014 14:33 - Юзер

Не работает данный код. Dle 10.1.
<script type="text/javascript">
$.ias({
container : '#dle-content', //индетификатор контейнера гду хранятся все новости
item:'.base.shortstory', //набор классов контейнера самой новости
pagination: '.dpad.basenavi.ignore-select', //набор классов контейнера блока постраничной навигации
next: '.nextprev a:last-child', //класс или идентификатор контейнера  постраничной навигации с ссылками где содержится ссылка на  следующую страницу
autoload: false, //включение или отключение автоподзагрузки
loader: '<p><center><font style="cursor:pointer;color:green;font-size:3em;"><i>Загрузить еще</i></font></center></p>' //шаблон кнопки или индикатора загрузки
});
</script>

rocksmart
64

307 | 115

rocksmart - 3 апреля 2014 14:35 - Юзер

код твоего navigation.tpl можно глянуть?

budda555
19 | 9

budda555 - 3 апреля 2014 14:39 - Юзер

Пожалуйста!
<div class="dpad basenavi ignore-select">
    <div class="bnnavi">
        <div class="navigation">{pages}</div>
        <div class="nextprev">
            [prev-link]<span class="thide pprev">Назад</span>[/prev-link]
            [next-link]<span class="thide pnext">Вперед</span>[/next-link]
        </div>
    </div>
</div>

<script type="text/javascript" src="src="{THEME}/js/jquery.ias.js"></script>
<script type="text/javascript">

$.ias({

container : '#dle-content', //индетификатор контейнера гду хранятся все новости

item:'.base.shortstory', //набор классов контейнера самой новости

pagination: '.dpad.basenavi.ignore-select', //набор классов контейнера блока постраничной навигации

next: '.nextprev a:last-child', //класс или идентификатор контейнера  постраничной навигации с ссылками где содержится ссылка на  следующую страницу

autoload: false, //включение или отключение автоподзагрузки

loader: '<p><center><font style="cursor:pointer;color:green;font-size:3em;"><i>Загрузить еще</i></font></center></p>' //шаблон кнопки или индикатора загрузки

});

</script>

budda555
19 | 9

budda555 - 3 апреля 2014 15:17 - Юзер

Ну, есть идеи?
Если нет, то прошу Вас убрать ответ, так как вопрос остается не решенным.

rocksmart
64

307 | 115

rocksmart - 3 апреля 2014 15:50 - Юзер

Скрипт рабочий но не пойму почему конфликт на 10.1


Проверил на 9.6 тоже работает

budda555
19 | 9

budda555 - 3 апреля 2014 16:05 - Юзер

А как же 10.1?

rocksmart
64

307 | 115

rocksmart - 3 апреля 2014 16:16 - Юзер

Смотрю

sadan
16

107 | 38

sadan - 3 апреля 2014 16:27 - Юзер

Вот попробуй это:

<center><a onclick="nextPage(); return false;" style="cursor: pointer" class="fbutton"><b>Показать еще</b></a></center>
<div id="ajax-next-page" style="display: none;">
    [next-link][/next-link]
</div>
<script type="text/javascript">
    function nextPage() {
        var nextPage = $('#ajax-next-page a').attr('href');
        ShowLoading("");
        if (nextPage !== undefined) {
            $.ajax({
                url: nextPage,
                success: function(data) {
                    $('#ajax-next-page').remove();
                    $('#next-page').remove();
                    HideLoading("");
                    $('#dle-content').append($('#dle-content', data).html());
                }
            }
                  )
        }
    };
</script>

budda555
19 | 9

budda555 - 3 апреля 2014 16:57 - Юзер

Так, кнопка появилась, только вот проблема такая, кнопка которая загружает 2-ю страницу остается между 1-й и 2-й загруженной, так я думаю не правильно, она после загрузки должна исчезнуть и еще, если страниц больше нет, не имеет смысла показывать кнопку, вот идеальная схема ajax навигации, я так думаю.

budda555
19 | 9

budda555 - 3 апреля 2014 17:01 - Юзер

Или, если страниц больше нет, вывести сообщение вместо кнопки.

dj-avtosh
39

1479 | 390

dj-avtosh - 3 апреля 2014 17:07 - шашлычник

Будда блин) напиши мне :D

skype: elhan.isaev

budda555
19 | 9

budda555 - 3 апреля 2014 17:10 - Юзер

Не хочу загружать тебя пустяковыми вопросами. :)

aebot
43

aebot - 11 апреля 2014 20:15 - Юзер

как решили проблему??

budda555
19 | 9

budda555 - 11 апреля 2014 21:18 - Юзер

Как всегда проблему решил, великий программист dj-avtosh

yziker
30 | 3

yziker - 11 апреля 2014 22:11 - Юзер

Если Вы и dj-avtosh не против, выложите сей творение на обзор людской.

aebot
43

aebot - 11 апреля 2014 23:59 - Юзер

присоединяюсь........очень надо. Кнопка дублирует..

dj-avtosh
39

1479 | 390

dj-avtosh - 12 апреля 2014 11:17 - шашлычник

Мы сделали много телодвижений по правке шаблонизатора и вывода по ajax только по определённым запросам. Такое не выложишь.

skype: elhan.isaev

aebot
43

aebot - 12 апреля 2014 17:21 - Юзер

и какой ценик?)

dj-avtosh
39

1479 | 390

dj-avtosh - 13 апреля 2014 01:04 - шашлычник

Никакой. Автор вопроса мой лучший друг.

skype: elhan.isaev

aebot
43

aebot - 13 апреля 2014 01:46 - Юзер

печаль, прям кружок дружбанов какой то меж собой диалог повели. Не так уж и много там шаманить то надо было. (заказал на фрилансе)

budda555
19 | 9

budda555 - 13 апреля 2014 02:03 - Юзер

А тебя сюда никто и не звал, вместо того чтобы тут философствовать пошел бы на фриланс сразу, так как с этим тоном тебе ответы надо покупать.

dj-avtosh
39

1479 | 390

dj-avtosh - 13 апреля 2014 04:32 - шашлычник

В следующий раз он просто получит бан.

skype: elhan.isaev

dj-avtosh
39

1479 | 390

dj-avtosh - 13 апреля 2014 04:34 - шашлычник

Все подобные модули подгружают заново всю страницу, но ajaxом. А мы пришли к решению загружать только нужные нам блоки, введя в компиляцию второй параметр. Мы за оптимизированный подход - поэтому пришлось повозиться.

skype: elhan.isaev

Gameer
225

1121 | 395

Gameer - 27 июля 2014 12:08 - Эксперт

Вот вам бесплатная версия от REZER

[aviable=main|cat]
<script language="javascript" type="text/javascript">

    var navAjaxUrlIE = /*@cc_on!@*/false;
    var lastExtNewsUrl = "";
    var lastExtNewsPage = 0;
    var mainClassNewsNavigation = "basenavi"; // navigation.tpl - название класса основного элемента
    function loadExtNews(){
        
        if( lastExtNewsUrl )
            {
                var url = lastExtNewsUrl.replace( "/page/" + lastExtNewsPage, "/page/" + ( lastExtNewsPage + 1 ) ) + "";
                lastExtNewsPage++;
            }
                else
            {
                var url = location.href;
                url = url.replace( new RegExp( "#(.*)", "g" ), "" ) + "";
                
                var RegExpC = new RegExp( "/page/([0-9]+)", "g" );
                if( url.match( RegExpC ) )
                    {
                        var page = url.match( /page\/[0-9]{1,50}/ ) + "";
                        page = parseInt( page.match( /[0-9]{1,50}/ ) );
                        var newPage = page + 1;
                        url = url.replace( "/page/" + page, "/page/" + newPage ) + "";
                        lastExtNewsPage = newPage;
                    }
                        else
                    {
                        url = url + "page/2/";
                        lastExtNewsPage = 2;
                    }
            }
        
        lastExtNewsUrl = url;
        
        $( "#dle-content ." + mainClassNewsNavigation + " a" ).html( "<span>Идёт загрузка...</span>" );
        
        $.ajax({
            url: url,
            data: "",
            success: function( data ){
                
                //var parser = new DOMParser();
                //var doc = parser.parseFromString( data, "text/html" );
                //$( "#dle-content ." + mainClassNewsNavigation ).remove();
                //$( "#dle-content" ).html( $( "#dle-content" ).html() + doc.getElementById( "dle-content" ).innerHTML );
                
                var cont = $( data ).find( "#dle-content" );
                $( "#dle-content ." + mainClassNewsNavigation ).remove();
                $( "#dle-content" ).html( $( "#dle-content" ).html() + $( cont[0] ).html() );  
                $( "#dle-content ." + mainClassNewsNavigation ).html( "<a href=\"#\" onclick=\"loadExtNews(); return false;\" class=\"loadExtNews\"><span>Загрузить ещё</span></a>" );
                
                if( !navAjaxUrlIE ) history.pushState( {}, "", lastExtNewsUrl );
            },
            error: function( xhr, ajaxOptions, thrownError ){
                // Можно по номеру ошибки определять, но в любом случае ответ не тот, показывать нечего, страхуемся )))
                $( "#dle-content ." + mainClassNewsNavigation ).html( "<a href=\"#\" onclick=\"return false;\" class=\"loadExtNews\"><span>Новостей больше нет</span></a>" );
            },
            dataType: "html",
            type: "POST"
        });
    }
    $( document ).ready(
        function(){
            $( "#dle-content ." + mainClassNewsNavigation ).html( "<a href=\"#\" onclick=\"loadExtNews(); return false;\" class=\"loadExtNews\"><span>Загрузить ещё</span></a>" );
        }
    );
</script>
[/aviable]

Истина в противоречии.​

Чтобы комментировать - войдите или зарегистрируйтесь на сайте

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