Кастомизация форм – очень больная тема в SharePoint. InfoPath фактически умер, новые способы кастомизации появятся не раньше следующего релиза (назначенного на конец 2015 года), а для использования SPServices нужен jQuery старой версии, что само по себе несет проблемы, так еще и требует знания отображаемых имен полей, что делает решение ненадежным. Подробнее в моем курсе по клиентской разработке SharePoint.

Создавая TypeScript-определения для клиентской библиотеки SharePoint  сделал несколько примеров полей. Недавно я провел большой рефакторинг и выделил кастомные поля в отдельные, повторно используемые функции.

Все функции содержатся в файле typescripttemplaes.ts. Тем, кто не пользуется TypeScript (зря!), можно скачать .js файл в том же каталоге.

Как пользоваться typescripttemplates:

  1. Скачать файл и добавить .js в проект
  2. Сделать свой файл скрипта для полей, такого вида:
    module _ {
    function init() {
        CSR.override()
            .lookupAddNew("Master", "Add New Master item", true)
            .register();        
    }

    SP.SOD.executeOrDelayUntilScriptLoaded(init, "typescripttemplates.ts");

    SP.SOD.executeOrDelayUntilScriptLoaded(function () {
        RegisterModuleInit(SPClientTemplates.Utility.ReplaceUrlTokens("~site/YOUR_SCRIPT_PATH.js"), init);
    }, "sp.js");
}
  3. Вписать адрес скрипта в ReplaceUrlTokens и вызовы функций между .override() и .register()
  4. В атрибут JSLink поля\формы\типа контента вписать строку такого вида: “~site/PATH/typescripttemplates.js|~site/YOUR_SCRIPT_PATH.js”.

Итак сами функции:

№1 Установка начального значения поля в формах

CSR.override()
   .setInitialValue("FieldInternalName", ANY_VALUE)
   .register();

Пригодится когда значения полей передаются в Url или через локальный кеш. Значение нужно передавать во внутреннем формате, который использует CSR.

№2 Скрытие поля

CSR.override()
   .makeHidden("FieldInternalName")
   .register();

Скрывает поле на форме, в представлении, и даже в режиме редактирования таблицы.

№3 Установка поля в Read-Only в формах

CSR.override()
   .makeReadOnly("FieldInternalName")
   .register();

Заменяет контрол ввода на контрол отображения. Пока не работает в для поля выбора пользователя.

№4 Вычисляемое значение поля

CSR.override()
   .computedValue("Title", function(x) {return SPClientTemplates.Utility.ParseLookupValue(x).LookupValue; }, "SOME_LOOKUP_FIELD")
   .register();

Автоматически задает значение поля при изменении в связанном поле.

№5 Добавление ссылки на добавление нового элемента в Lookup

CSR.override()
   .lookupAddNew("Master", "Add New Master item", true)
   .register();

Добавляет рядом с Lookup-полем ссылку, которая открывает форму добавления в связанный список. Последний параметр задает открывать ли форму в диалоге или переходом на страницу формы

№6 Фильтрация Lookup

CSR.override()
   .filteredLookup("Master", '<BeginsWith><FieldRef Name ="Title" /><Value Type = "Text" >{Title}</Value></BeginsWith>')
   .register();

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

№7 Lookup на основе поиска

CSR.override()
   .seachLookup("LookupFieldInternalName")
   .register();

Заменяет стандартный элемент выбора на компонент autofill, входящий в SharePoint. Для получения связанных элементов используется поиск. Будет работать даже для очень больших списков. В ближайшее время будет добавлена возможность указывать запрос, который выполняется при получении элементов.

Для этого поля надо в JSLink добавить ссылки на файлы autofill.js и sp.search.js – “~site/PATH/typescripttemplates.js|~site/YOUR_SCRIPT_PATH.js|autofill.js(d)|sp.search.js(d)”

Заключение

Качайте, пользуйтесь, пишите фидбек здесь и на сайте проекта - http://sptypescript.codeplex.com/workitem/list/basic. Кроме указанных выше готовых контролов, есть еще куча хелперов, которые вам помогут делать свои шаблоны полей.

Если хелперы будут популярны, то я выложу библиотеку в NuGet.

Теги : SharePoint 2013, autocomplete, js, sp2013, javascript, typescript, поиск