Работа с HTML-макетами в 1С — это мощный инструмент для создания красивых печатных форм, интерактивных дашбордов или сложных договоров, которые сложно реализовать стандартным табличным документом. Однако новички часто сталкиваются с вопросом: как именно "прокинуть" данные из справочника или документа в этот шаблон. В этой статье мы подробно разберем все доступные способы, проанализируем типичные ошибки и выясним, как сделать работу с HTML максимально стабильной.
Рассмотрим ситуацию, когда у вас есть готовый текст договора в формате HTML. Вместо того чтобы пытаться программно найти каждое поле в структуре документа, проще всего заранее подготовить шаблон. В тексте HTML-макета мы расставляем уникальные маркеры, например [НомерДоговора], [ДатаДоговора] или [Контрагент]. Для подготовки и визуального редактирования исходных шаблонов можно использовать обработку-редактор HTML для управляемого интерфейса.
Проанализируем процесс программной обработки такого макета. Мы получаем текст макета в строку, а затем используем стандартную функцию 1С СтрЗаменить. Этот метод хорош тем, что он не зависит от того, успел ли прогрузиться HTML-документ в форме или нет.
// Получаем текст макета из справочника
МакетHTML = Справочники.Договоры.ПолучитьМакет("ДоговорHTML");
ТекстШаблона = МакетHTML.ПолучитьТекст();
// Подставляем параметры
ТекстШаблона = СтрЗаменить(ТекстШаблона, "[НомерДоговора]", Объект.Номер);
ТекстШаблона = СтрЗаменить(ТекстШаблона, "[ДатаДоговора]", Формат(Объект.Дата, "ДЛФ=DD"));
ТекстШаблона = СтрЗаменить(ТекстШаблона, "[Контрагент]", Строка(Объект.Контрагент));
// Выводим результат в реквизит формы, связанный с полем HTML-документа
ЭтаФорма.ТекстHTML_Поле = ТекстШаблона;
Важный нюанс: при передаче данных из 1С (например, наименований со спецсимволами вроде & или ") текст может отобразиться некорректно или "сломать" верстку. Рекомендуется обрабатывать передаваемые строки, заменяя опасные символы на их HTML-сущности (например, кавычки на ").
Часто в договоре или отчете нужно вывести таблицу с переменным количеством строк (например, список контактных лиц или перечень товаров). Прямая замена "заплатки" здесь не подойдет, если количество строк заранее неизвестно. Выясним, как сформировать HTML-код таблицы программно.
Рассмотрим пример, в котором мы обходим коллекцию строк и собираем HTML-строку "на лету". Мы создаем заголовок таблицы, а затем в цикле добавляем теги <tr> и <td>.
HTMLТекст = "<table border='1' style='width:100%; border-collapse: collapse;'>";
// Шапка таблицы
HTMLТекст = HTMLТекст + "<tr><th>Вид контакта</th><th>Представление</th></tr>";
// Заполнение данными из табличной части или выборки
Для Каждого СтрокаКонтактов Из Объект.КонтактнаяИнформация Цикл
HTMLТекст = HTMLТекст + "<tr>";
HTMLТекст = HTMLТекст + "<td>" + СтрокаКонтактов.Вид + "</td>";
HTMLТекст = HTMLТекст + "<td>" + СтрокаКонтактов.Представление + "</td>";
HTMLТекст = HTMLТекст + "</tr>";
КонецЦикла;
HTMLТекст = HTMLТекст + "</table>";
// Вставляем готовую таблицу в общее тело документа
ИтоговыйHTML = СтрЗаменить(ТекстШаблона, "[ТаблицаКонтактов]", HTMLТекст);
Для более сложных структур можно использовать объекты ПостроительDOM, ЧтениеHTML и ЗаписьHTML. Это позволит избежать ошибок с незакрытыми тегами, которые часто возникают при ручной склейке строк.
Иногда требуется изменить конкретный элемент уже загруженной страницы без перезагрузки всего текста. Для этого используется обращение к Элементы.ИмяПоляHTML.Документ. Однако здесь разработчики часто сталкиваются с ошибкой: "Значение не является значением объектного типа (innerText)".
Разберем причину: эта ошибка возникает, если вы пытаетесь обратиться к getElementById в тот момент, когда страница еще не полностью отрендерена движком (особенно в тонком клиенте). Чтобы этого избежать, манипуляции с элементами нужно выполнять строго в событии ДокументСформирован поля HTML-документа.
&НаКлиенте
Процедура ПолеHTMLДокументСформирован(Элемент)
// Документ готов, теперь можно обращаться к DOM
ДокументHTML = Элементы.ПолеHTML.Документ;
ЭлементКонтрагент = ДокументHTML.getElementById("contractor_name");
Если ЭлементКонтрагент <> Неопределено Тогда
ЭлементКонтрагент.innerText = "ООО 'Ромашка'";
КонецЕсли;
КонецПроцедуры
Чтобы ваш HTML-макет был по-настоящему профессиональным, разберем еще несколько технических нюансов:
Base64 и вставлять её прямо в тег <img src="data:image/png;base64,...">. В 1С это делается функцией Base64Строка(ДвоичныеДанные).ПолучитьНавигационнуюСсылку(ОбъектСсылка) и вставляйте её в атрибут href тега <a>.@media print. Это позволит скрыть кнопки управления на форме при выводе на печать и настроить разрывы страниц с помощью свойства page-break-after: always;.Проанализировав все способы, можно сделать вывод: для простых печатных форм идеален метод строковых замен, а для сложных интерактивных интерфейсов — комбинация DOM-манипуляций и событийной модели поля HTML-документа. Сочетание этих подходов позволит вам закрыть любой "гештальт" по работе с макетами в 1С.