ПолеHTML

Содержание

1С Поле HTML документа — Кнопки
1. Создаем HTML страницу.
2. Создаем конфигурацию 1С.
3. Создаем код модуля формы.
1С 8.x : ПолеHTMLДокумента ~ Программное формирование HTML-документа, содержащего Ссылки на объекты БД
Похожие FAQ
Еще в этой же категории

1С Поле HTML документа — Кнопки

Простой пример взаимодействия между платформой 1С и интерфейсом на основе HTML и CSS, при помощи элемента вида «Поле HTML документа». В данном примере, будет рассмотрена реакция при нажатии кнопки в поле HTML документа.

Обновление 10.12.2021:
Добавлен дополнительный способ получить событие нажатия кнопки и обработать переданные данные через атрибут «data-*», для этого будет использоваться ручное добавление обработчика события, для элемента поля HTML.

1. Создаем HTML страницу.

Для этого в любом редакторе кода поддерживающим HTML и CSS необходимо создать страницу, содержащую три тега a , которые с помощью стилей будут представлены в виде кнопок.

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

Для ссылок (кнопок) атрибут «href» тега a будет равен «#», то есть пустой «якорь».

В качестве идентификаторов кнопок будет использоваться атрибут «data-*» тега a в следующем виде data-button-id=’1′.

      body < background-image: radial-gradient(circle farthest-corner at 50% 50%, rgba(236, 239, 244, 1) 0%, rgba(216, 222, 233, 1) 100%); >.container < position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); >.square_btn < position: relative; display: inline-block; padding: 0.25em 0.5em; text-decoration: none; color: #FFF; background: #fd9535; /*button color*/ border-bottom: solid 2px #d27d00; /*daker color*/ border-radius: 4px; box-shadow: inset 0 2px 0 rgba(255, 255, 255, 0.2), 0 2px 2px rgba(0, 0, 0, 0.19); font-weight: bold; >.square_btn:active

2. Создаем конфигурацию 1С.

Создаем пустую конфигурацию, в которой добавляем общий макет «МакетHTML», с типом «HTML документ»:

Во вкладке «Текст» макета, помещаем исходный код HTML страницы из пункта 1.

Следующим шагом будет добавление общей произвольной формы «ПолеHTML», которую необходимо установить в рабочую область начальной страницы:

В форме добавляем реквизит «ПолеHTML» тип строка и переносим его на форму, для элемента, устанавливаем вид «Поле HTML документа»:

Реквизит формы Поле HTML документа

3. Создаем код модуля формы.

Для формы необходимо добавить обработчик «ПриСозданииНаСервере», в котором будет происходит загрузка текста из «МакетаHTML» в элемент формы «ПолеHTML».

Теперь необходимо добавить обработчик «ПриНажатии» для элементы формы «ПолеHTML», в котором происходит основная обработка нажатий внутри HTML документа:

#Область ОбработчикиСобытийФормы &НаСервере Процедура ПриСозданииНаСервере(Отказ, СтандартнаяОбработка) ПолеHTML = ПолучитьОбщийМакет("МакетHTML").ПолучитьТекст(); КонецПроцедуры #КонецОбласти #Область ОбработчикиСобытийЭлементовФормы &НаКлиенте Процедура ПолеHTMLПриНажатии(Элемент, ДанныеСобытия, СтандартнаяОбработка) // Проверяем, что нажатие было на ссылке (кнопке). Если ДанныеСобытия.Anchor = Неопределено Тогда Возврат; КонецЕсли; // Проверяем, что у ссылки (кнопки) есть атрибуты для анализа. КоличествоАтрибутов = ДанныеСобытия.Anchor.attributes.length; Если КоличествоАтрибутов = 0 Тогда Возврат; КонецЕсли; // Ищем среди атрибутов необходимые данные ссылки (кнопки). Для каждого Атрибут Из ДанныеСобытия.Anchor.attributes Цикл Если Атрибут.name = "data-button-id" Тогда ПоказатьПредупреждение(, Атрибут.value, , "Нажата кнопка:"); Прервать; КонецЕсли; КонецЦикла; КонецПроцедуры #КонецОбласти

Источники информации:

Поле HTML — Добавить обработчик

2. Для реквизита «ПолеHTML» добавить обработку события «ДокументСформирован», содержащую следующий код:

&НаКлиенте Процедура ПолеHTMLДокументСформирован(Элемент) ДокументHTML = Элементы.ПолеHTML.Документ; ДобавитьОбработчик ДокументHTML.links[3].onclick, ОбработчикПриНажатии; КонецПроцедуры

3. Непосредственно добавить сам обработчик нажатия:

Источник

1С 8.x : ПолеHTMLДокумента ~ Программное формирование HTML-документа, содержащего Ссылки на объекты БД

Программное формирование HTML-документа, содержащего ссылки на объекты базы данных 1С
В данной статье рассматривается способ программного формирования HTML документа, содержащего ссылки на объекты базы данных 1С, такие как справочники, документы и т.д. Показан пример построения обработчика события OnClick ПоляHTMLДокумента, для обработки клика на html-ссылке.

Предисловие
Однажды, дописывая обработку, создающую и модифицирующую, не суть важно какие документы, я подумал, что неплохо было бы вывести для пользователя некое резюме:
“Создан документ такой-то”
“Изменен документ такой-то” и т.д.
От обычного, в таких случаях, вывода информации в окно сообщений я сразу отказался, так как не удобно это, сначала читать в окне сообщений “Создан документ … ” а потом запоминать его номер, открывать соответствующий журнал (или форму списка) и искать там этот документ. А если документов много и пользователь хочет посмотреть все документы?(или выборочно) Насколько это неудобно я убедился при отладке обработки …
То, что в форме есть элемент управления именуемый ПолеHTMLДокумента я конечно знал, но вот представилась возможность познакомиться с ним поближе. Было решено реестр обработанных документов выводить в виде html документа содержащего ссылки на эти самые документы, а по клику на ссылке открывать форму соответствующего документа. Здесь мне многие могут возразить: “А почему бы для этих целей не использовать обычный макет, выводимый в табличный документ, а для открытия документов использовать расшифровку? И чем Ваш способ лучше?” Отвечаю: Конечно можно использовать, и мой способ ничем не лучше. Он просто другой. Ведь у хорошего программиста для решения одной задачи должно быть в арсенале несколько инструментов.
Итак, перейдем от слов к делу, в рамках данной статьи рассмотрим следующую задачу: Сформировать html-документ, содержащий ссылки на элементы справочника номенклатура, по клику требуется открывать форму соответствующего элемента. Создаем новый отчет, его форму, на форме размещаем элемент управления ПолеHTMLДокумента.
Код 1C v 8.х

 Процедура ДобавитьТекстHTML(ТекстHTML, Элемент); 
// Ссылку будем формировать хитро: 
// Предполагаем что символ "-" не входит в имена объектов метаданных, 
// учавствующих в формировании html 
// Тогда ссылка будет иметь следующий вид: 
// Номенклатура-d341d377-b3b1-11dc-a100-0011d85708ff 
// Передавать нашу ссылку будем через атрибут id 
СсылкаНаЭлемент = Элемент.Метаданные().Имя+"-" 
+Элемент.Ссылка.УникальныйИдентификатор(); 
ТекстHTML.ДобавитьСтроку(" + Элемент + """ >"+Элемент+""); 
КонецПроцедуры 
 
Процедура ДействияФормыСформировать(Кнопка) 
Запрос = Новый Запрос(" 
|ВЫБРАТЬ 
| Номенклатура.Ссылка 
|ИЗ 
| Справочник.Номенклатура КАК Номенклатура"); 
ТекстHTML = Новый ТекстовыйДокумент; 
Выборка = Запрос.Выполнить().Выбрать(); 
Пока Выборка.Следующий() Цикл 
ДобавитьТекстHTML(ТекстHTML, Выборка.Ссылка); 
КонецЦикла; 
ЭлементыФормы.ПолеHTMLДокумента.УстановитьТекст(ТекстHTML.ПолучитьТекст()); 
КонецПроцедуры

Ну вот html мы сформировали, теперь чтобы ссылки “ожили” надо написать обработчик события OnClick элемента управления ПолеHTMLДокумента.
Код 1C v 8.х

Заключение
Обратите внимание что ссылку я формировал следующим образом:
— это сделано для того, чтобы в обработчике onclick можно было определить к какому объекту метаданных относится данный УникальныйИдентификатор, потому что имея ТОЛЬКО УникальныйИдентификатор невозможно определить к какому объекту метаданных он относиться. Точнее возможно, но уж слишком долго и неудобно – путем перебора всех метаданных в цикле, для каждого объекта метаданных выполнять попытку .ПолучитьСсылку(Новый УникальныйИдентификатор(НашУникальныйИдентификатор))
Хотя в нашем примере только один справочник, и указывать его вид было необязательно, и так понятно что это УникальныйИдентификатор элемента справочника Номенклатура, но вдруг Вам потребуется работать с несколькими справочниками, вот тут то мой способ задания ссылки Вам и пригодится.
P.S. Платформа 8.2 имеет встроенный механизм работы со ссылками на объекты БД и данная задача наверняка упростится, но это уже другая тема.
Источник

Еще в этой же категории

Форма ~ Программное создание таблицы значений с условным оформлением 13
Как создать на форме таблицу и сделать для нее подсветку содержимого колонки в строке по условию? Итак для начала нам надо добавить реквизиты в форму. Для этого у нас есть метод: ИзменитьРеквизиты(). Перед тем как его использовать мы сформируем ма Поле выбора ~ Заполнение списка значений в элементе поле выбора на форме 11
//Заполнение списка перебором данных // Элемент формы МетаданныеВыбор имеет тип — Произвольный, Использование — Режим выбора из Списка, кнопка списка Для Каждого Метаданное из Метаданные.РегламентныеЗадания Цикл ЭлементыФормы.МетаданныеВыбор.Спи Поле выбора ~ Как ограничить список выбора? 8
Ограничим список элементов, установив отбор в открываемой форме //Пример 1 Процедура СтатьяПДРНачалоВыбора(Элемент, СтандартнаяОбработка) ФормаВыбора = Справочники.ПрочиеДоходыИРасходы.ПолучитьФормуВыбора(, Элемент); ЭлементОтбораВидПДР = Форма Форма ~ Как активизировать, перевести фокус на необходимый элемент на форме? 8
//Текущему Элементу формы присваиваем элемент котровый необходимо активизировать ЭтаФорма.ТекущийЭлемент = ЭлементыФормы.ТабличноеПоле; Как программно установить событие для элемента формы? 7
//Привяжем к нашей таблице вызов процедуры обработки //события » ПередОкончаниемРедактирования» . процедура должна существовать . ДействиеОбработкаВыбора = Новый Действие(» ОбработкаВыбораЗнач» ); ЭлементыФормы .УстановитьДействие(» Пере Посмотреть все в категории Работа с Формой (Диалог) и её элементами