На самом деле в этой статье главное, что я хочу показать - это силу Smarty-шаблонизацию :) И посмотрим мы это на реальном примере. Сразу попрошу не кидаться помидорами по поводу чистоты кода и JS-а в основной части страницы (это все будет в процессе поправлено, пока проект в работе, да и не критично это совсем). Главное - это понять механизм работы расширяемых смарти-шаблонов и блоков в них.

Итак, покликайте каталог на http://dev.capdel.ru.modxdev.webtm.ru/shop/catalog/ основные разделы слева, фильтр-сортировку и постраничность. Там на Ajax-е. И сейчас я немного расскажу как Ajax там реализован и расширяемые шаблоны.

Вот Смарти-шаблон этого каталога: https://gist.github.com/Fi1osof/22dd35b45d409bd0fc38. На самом деле в нем ни на что смотреть особо не надо, потому что самое главное в конце вот это: https://gist.github.com/Fi1osof/22dd35b45d409bd0fc38#file-gistfile1-tpl-L109. То есть в контент выводится подшаблон shop/catalog/list.tpl

{block name=content}

    [[!smarty?tpl=`shop/catalog/list.tpl`]]

{/block}

В итоге, самое главное здесь для вывода каталога - это шаблон shop/catalog/list.tpl. Вот этот шаблон: https://gist.github.com/Fi1osof/03da6107160d12575dad. Там все до кучи, включая JS. Так вот, обратите внимание на блоки в этом шаблоне, типа {block name=products_content}. Эти блоки можно переопределять в расширяющих шаблонах. И в этом шаблоне самое главное, это получение списка товаров и набивка их HTML-а в переменную https://gist.github.com/Fi1osof/03da6107160d12575dad#file-gistfile1-tpl-L20 и в конце уже вывод этого HTML-а внутри общего шаблона https://gist.github.com/Fi1osof/03da6107160d12575dad#file-gistfile1-tpl-L255.

Мы подобрались к главному - это Ajax-запрос и получение HTML-а для вывода. По сути нам нужен тот же самый шаблон, ибо выводим основное содержимое каталога. Но нам не надо вообще все, то есть нам не нужен содержащийся в нем JS, блок фильтров и т.п. Создаем для Ajax-запросов документ-страничку и прописываем в нем вызов другого смарти-шаблона

[[!smarty?tpl=`shop/catalog/ajax/list.tpl`]]

А в нем вот такой код:

{extends file="shop/catalog/list.tpl"}

{block name=products_content}

    {$products_html}

{/block}

То есть все. В нем больше ничего нет. И он выводит только основную часть каталога и больше ничего.

В чем магия? Переопределение блока products_content. https://gist.github.com/Fi1osof/03da6107160d12575dad#file-gistfile1-tpl-L23.

То есть все, что выше этого блока (формирование фильтров, вызов процессора, набивка HTML-а товаров и т.п.), и ниже этого блока (если что-то там появится) - все это будет так же выполняться, а основной блок products_content в расширяющем процессоре переопределяется и выводится только HTML товаров.

Таким образом мы имеем единый механизм вывода каталога обычным способом и Ajax-ом.

То есть и логика выборки единая, и оформление единое и т.д. и т.п., но вывод мы аккуратно переопределяем.