четверг, 20 марта 2014 г.

Использование модальных диалогов в SharePoint

Возможность редактирования и добавления элементов нужна всегда, а возиться и делать свои собственные диалоги не всегда есть возможность и необходимость. Тем более, если есть возможность использовать стандартные. Давайте, посмотрим, куда, например, ведет ссылка "Add new item" в стандартном списке "Tasks":


Ведет она вот сюда:
Add new item


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

Итак, первый способ использование модальных диалоговых окошек - использование этой функции. Правда, для ее использования вам нужно знать несколько параметром: Guid списка (обязательно), ID элемента (обязательно для редактирования), ID типа контента (нужно только, если ваш список использует несколько типов контента, и вам нужен отличный от того, что по умолчанию). Ну и самое главное - нужно указать тип диалога. Их всего три: PageType=4 (просмотр), PageType=6 (редактирование) и PageType=8 (создание нового элемента). То есть, получается примерно так:

Просмотр элемента

Редактирование элемента

Добавление элемента

А теперь второй способ:

Второй способ - использование SharePoint Dialog Framework самостоятельно. Точнее, нас интересует функция SP.UI.ModalDialog.showModalDialog. Вызывается она вот так:
  
      var options = {
      title: "My Dialog Title",
      width: 400,
      height: 600,
      url: "/_layouts/DialogPage.aspx" };

  SP.UI.ModalDialog.showModalDialog(options);

В качестве параметра URL в нашем случае удобнее всего будет использовать стандартные формы, которые создаются для каждого листа DispForm.aspx, EditForm.aspx и NewForm.aspx. Первые две из них вызываются с параметром, указывающим ID элемента в виде DispForm.aspx?ID=123. То есть, параметр URL в options, для, например, сайта test, будет выглядеть вот так:
 
    url: "/Sites/Test/Lists/Tasks/DispForm.aspx?ID=123"

Вот, в общем-то, и все.
Кстати, очень рекомендую почитать про SP.UI.* , там много интересных возможностей есть. Ну а начать можно именно с функции showModalDialog: http://msdn.microsoft.com/en-us/library/office/ff410058(v=office.14).aspx

Комментариев нет:

Отправить комментарий