[ELMA3] Всплывающие подсказки

Для создания подсказок используется: http://craigsworks.com/projects/qtip/. Всплывающая подсказка состоит из 2-х частей: заголовок и текст. Для того чтобы подсказка сформировалась достаточно задать только текст. Есть несколько способов навешивания всплывающий подсказки на HTML элемент.

Меню

Добавлены 2 свойства для у ActionToolbarItem: ToolTipHeader и ToolTip. Задать их можно как напрямую, так и с помощью билдера.

@(Html.Toolbar().Group().ToolbarButton(new ActionToolbarItem(Html.GenerateName())
{
Text = SR.T("Отправить"),
IconUrl = "#x24/run_doc.gif",
ToolTipHeader = SR.T("Отправка"),
ToolTip = SR.T("Работа с документами"),
Items =
{
new ActionToolbarItem(Html.GenerateName())
{
Text = SR.T("Отправить на согласование"),
ToolTip = SR.T("Отправить на согласование. Исполнители должны высказать свое согласие или несогласие с содержанием документа") 
},
new ActionToolbarItem(Html.GenerateName())
{
Text = SR.T("Отправить на ознакомление"),
ToolTip = SR.T("Отправить на ознакомление. Исполнители должны подтвердить прочтение документа") 
}
} 
})
)

@(Html.Toolbar().Group().Buttons(b =>
{
b.ContentAction(ContentActionProvider.CreateDocument)
.ToolTipHeader(SR.T("Создание нового документа"))
.ToolTip(SR.T("Создает документ в текущей папке"));
b.ContentAction(ContentActionProvider.CreateFolder)
.ToolTipHeader(SR.T("Создание папки"))
.ToolTip(SR.T("Создает новую папку в текущей"))
.IconUrl(Url.Image("#x24/folders.gif"))
.Text(SR.T("Папка"))
.Buttons(bi => bi.ContentAction(ContentActionProvider.CreateFolder));
}))

HTML атрибуты

Для формирования подсказки используется 2 атрибута: tooltipheader - заголовок и tooltiptext - текст подсказки. Для примера:

@Html.ImageButton("#x16/place_add.gif", "", Html.OpenPopup("AddNomenclaturePopup").ToString(), anchorHtmlAttributes: new { @class = "tree-item-button", tooltipheader = SR.T("Добавить место регистрации"), tooltiptext = SR.T("Создать новое место регистрации или выбрать существующее") })
@Html.ImageButton("#x16/nomen_add.gif", "", string.Format("OpenDepositoryGroupPopup(0, {0});", (object)item.Value), anchorHtmlAttributes: new { @class = "tree-item-button", tooltipheader = SR.T("Добавить раздел в номенклатуру"), tooltiptext = SR.T("Перейти к созданию нового раздела в номенклатуре") })
@Html.ImageButton("#x16/delo_add.gif", "", string.Format("OpenDepositoryPopup(0, {0});", (object)item.Value), anchorHtmlAttributes: new { @class = "tree-item-button", tooltipheader = SR.T("Добавить дело в номенклатуру"), tooltiptext = SR.T("Перейти к созданию нового дела в номенклатуре") })
@Html.ImageButton("#x16/delo_add_link.gif", "", string.Format("OpenDepositoryLinkPopup(0, {0});", (object)item.Value), anchorHtmlAttributes: new { @class = "tree-item-button", tooltipheader = SR.T("Добавить ссылку на дело"), tooltiptext = SR.T("Перейти к созданию ссылку на выбранное дело") })
@if (item.TypeUid != InterfaceActivator.UID(typeof(IRegistrationPlaceItem))) {
@Html.ImageButton("#x16/edit.gif", "", string.Format("EditObject({0})", (object)item.Value), anchorHtmlAttributes: new { @class = "tree-item-button", tooltiptext = SR.T("Изменить") })
@Html.ImageButton("#x16/delete.gif", "", string.Format("DeleteRepositoryGroup({0})", (object)item.Value), anchorHtmlAttributes: new { @class = "tree-item-button", tooltiptext = SR.T("Удалить") })
}

Скриптом

Для формирования скрипта сделан билдер Html.Tooltip("selector"). В качестве селектора используется jquery-селектор. У билдера 2 метода Header("text") и Text("text"), для задания заголовка и текста всплывающей подсказки.

$(document).ready(function() {
@(Html.Tooltip("#elementid").Header(SR.T("Заголовок")).Text(SR.T("Текст всплывающей подсказки")).Script())
});