Формат HTML в 1С, как сделать

Внедрение и использование HTML-формата в прикладных решениях на платформе 1С:Предприятие открывает перед разработчиками и пользователями новые горизонты в области визуализации данных, построения интерактивных интерфейсов и интеграции с внешними веб-сервисами. Это позволяет отойти от стандартного, несколько ограниченного, дизайна форм и отчетов, присущего традиционному подходу «1С», и создать более современные, динамичные и удобные для конечного пользователя интерфейсы. Использование HTML в «1С» — это, по сути, интеграция веб-технологий внутрь толстого или тонкого клиента, что требует понимания специфических механизмов взаимодействия между средой «1С» и встроенным HTML-документом.

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

Механизм поля HTML-документа

Основным инструментом для интеграции HTML в формы «1С:Предприятие» является элемент управления Поле HTML-документа. Этот элемент, по сути, представляет собой встроенный браузерный движок (чаще всего на основе стандартных компонентов операционной системы, например, Internet Explorer или WebKit/Chromium в более новых версиях платформы), который способен отображать и обрабатывать HTML, CSS и javascript.

Создание и размещение поля

Чтобы начать работать с HTML в форме, необходимо выполнить несколько подготовительных шагов в конфигураторе.

1. Добавление Реквизита. Сначала в форме, где будет отображаться HTML-контент, создается реквизит формы с типом Строка.
2. Изменение Вида Элемента. Этот реквизит переносится на форму, и его Вид в свойствах элемента управления устанавливается как Поле HTML-документа.
3. Присвоение Значения. Содержимое HTML-документа (сам HTML-код) присваивается свойству Значение этого реквизита. Это может быть как статичный код из макета конфигурации, так и динамически сгенерированный код.

Разработчик может использовать Макет в конфигурации с типом HTML-документ для хранения большого или сложного HTML-кода. Содержимое такого макета легко считывается в строковую переменную и присваивается полю.

Динамическое формирование контента

Часто HTML-контент формируется динамически на стороне 1С-сервера или клиента, основываясь на данных из информационной базы.

Например, для формирования списка номенклатуры в виде HTML-таблицы или списка, используется следующий подход:

• Выполняется запрос к базе данных «1С» (например, к справочнику «Номенклатура»).
• Результат запроса (выборка) итерируется в цикле.
• На каждой итерации с помощью строковых операций или объекта ТекстовыйДокумент формируются соответствующие HTML-теги (tr, td, ul, li и т.д.), в которые вставляются данные из выборки.
• В результате получается полная HTML-строка, которая затем присваивается полю.

Именно такой подход позволяет строить отчеты или интерактивные списки, внешний вид которых значительно превосходит стандартные элементы форм «1С».

Взаимодействие между 1С и HTML/javascript

Ключевой аспект использования HTML в «1С» — это обеспечение двустороннего обмена данными и командами между кодом на языке 1С (серверный/клиентский) и кодом на javascript (внутри HTML-поля).

Передача данных из 1С в HTML

Простейший способ передачи данных — это непосредственное включение их в HTML-код при его динамическом формировании, как было описано выше.

Более сложный, но гибкий способ — это использование объектной модели документа (DOM) после его загрузки. После того как HTML-документ сформирован и отображен, разработчик «1С» может получить доступ к его объектной модели через свойство Документ элемента Поле HTML-документа. Используя методы DOM, можно:

• Найти конкретные HTML-элементы по ID или другим атрибутам.
• Изменить их содержимое (например, текст или значение поля ввода).
• Вызвать javascript-функции, определенные в HTML-документе.

Для вызова javascript-функции из кода 1С используется метод, например, Элементы.ПолеHTML.Документ.defaultView.JSФункция(Параметр1, Параметр2).

Передача данных из HTML в 1С

Обратный обмен, когда событие в HTML (например, нажатие кнопки) должно вызвать действие в коде «1С», реализуется через обработчики событий и специальные механизмы.

1. Обработчик События в 1С. На элементе формы Поле HTML-документа можно создать обработчик события ПриНажатии (или других событий, специфичных для браузерного движка).
2. Запуск События Из javascript. В javascript-коде, который обрабатывает нажатие кнопки, вместо стандартной навигации или отправки формы, генерируется специальный вызов, который «перехватывается» платформой «1С». Традиционно для этого используется изменение атрибута location.href с использованием специального префикса (например, window.location.href = "1c://команда?параметр1=значение").
3. Анализ в 1С. В обработчике ПриНажатии на стороне 1С анализируется перехваченный URL. Из него извлекаются имя команды (команда) и параметры (значение). На основе этих данных выполняется соответствующая логика «1С» (запись в базу, вызов серверной процедуры и т.д.).

Вот список преимуществ, которые дает использование HTML-формата в «1С:Предприятие»:

• Расширенная визуализация данных. Позволяет создавать сложные графики, диаграммы и интерактивные отчеты с использованием современных javascript-библиотек.
• Гибкий и современный дизайн интерфейса. Дает возможность полного контроля над внешним видом формы, используя CSS для кастомизации.
• Интеграция с внешними веб-сервисами. Облегчает встраивание контента или функциональности с внешних сайтов или сервисов прямо в интерфейс «1С».
• Реализация функционала, недоступного в стандартных элементах 1С. Например, сложные текстовые редакторы или специфические элементы управления.

Разработка на платформе «1С» с использованием HTML требует от разработчика знания не только встроенного языка, но и основ веб-технологий — HTML, CSS и javascript.

Примеры практического применения

Использование Поля HTML-документа находит свое применение в различных областях:

Интерактивные отчеты и дашборды

• Визуализация показателей. На основе данных из «1С» формируется JSON-объект, который передается в javascript. javascript, используя библиотеки вроде Chart.js или D3.js, строит красивые и динамичные графики прямо в форме «1С».

• Детализация данных. Нажатие на элемент графика в HTML может передать соответствующий параметр в 1С, который, в свою очередь, открывает новую форму с детализацией данных (например, список документов, составляющих показатель).

Внешние элементы управления

• Кастомизированные элементы ввода. Разработчик может создать сложный календарь, фильтр или древовидную структуру на HTML/JS, которая будет удобнее стандартных элементов «1С», и настроить обмен значениями с реквизитами формы.

Обмен данными с внешними системами

• Встраивание веб-форм. В поле HTML может быть загружена внешняя веб-форма для сбора данных, которые затем через javascript и механизмы обмена будут переданы для обработки в «1С».

Важно помнить, что при работе с DOM в «1С» следует использовать обработчик события ДокументСформирован и проверять свойство readyState HTML-документа.

1. Проверка готовности документа обязательна для предотвращения ошибок доступа к DOM-модели.
2. Необходимо убедиться, что свойство readyState равно "complete", прежде чем пытаться манипулировать элементами документа или вызывать функции javascript.
3. Использование циклического опроса свойства readyState вне обработчика события ДокументСформирован не рекомендуется, так как это может привести к зависанию.

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