Рубрики
sharepoint

Оставить стандартное меню представлений при кастомизации с помощью CSR и JSLink

При кастомизации представлений списков с помощью JSLink часто возникает небольшая проблема: переопределение overrideCtx.Templates.Header переопределяет заодно и меню переключения представлений. Аналогично и с overrideCtx.Templates.Footer. Но есть решение.

Меню выбора представлений списка SP2013
Меню выбора представлений списка SP2013

В файле clienttemplates.js (адрес /_layouts/15/clienttemplates.js) содержатся многие стандартные преобразования для представлений. Там можно найти стандартный заголовок — в функции SingleItem_RenderHeaderTemplate(renderCtx) { … }. Для использования кода удобно пользоваться файлом clienttemplates.debug.js.

Наш header будет выглядеть так:

...
overrideCtx.Templates.Header = customHeader;
...
function customHeader(ctx) {
    var listSchema = ctx.ListSchema;
    var ret = [];

    ret.push("<div>");
    if (listSchema.RenderViewSelectorPivotMenu == "True")
        ret.push(RenderViewSelectorPivotMenu(ctx));
    else if (listSchema.RenderViewSelectorPivotMenuAsync == "True")
        ret.push(RenderViewSelectorPivotMenuAsync(ctx));
    ret.push("</div>");
	
    //наша добавленная разметка
    ret.push("<div id='galleria' ></div>");
	
    return ret.join("");
}

Вообще, полезно поизучать clienttemplates.debug.js. В этом файле есть часть стандартных JSLink представлений SharePoint 2013.