Javascript и 1С. Кросс-платформенное взаимодействие

01.12.16

Разработка - Работа с интерфейсом

Что делать, если необходим богатый интерфейс, а управляемые формы нам его не могут обеспечить? Использовать HTML и JavaScript. В статье рассмотрено взаимодействие кода 1С и JavaScript, работающее на любой платформе: толстый, тонкий и веб-клиент, под Windows и Linux.

Скачать файлы

Наименование Файл Версия Размер
ВзаимодействиеJavaScriptИ1C
.epf 12,23Kb
264
.epf 12,23Kb 264 Скачать

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

Предлагается решение, которое работает как в тонком, так и в веб-клиенте. Под Windows и Linux.

Примечание: при упоминании работоспособности в тонком клиенте, также подразумевается работоспособность и в толстом клиенте (управляемое приложение).



Взаимодействие кода 1С и JavaScript.

Вызов методов языка JavaScript из кода 1С.

Методы JavaScript могут быть вызваны из 1C так:

<Окно документа>.funcName(funcArgs);

Глобальные переменные доступны следующим образом:

<Окно документа>.varName;

Для браузера Internet Explorer окно документа доступно через

Элементы.ПолеHTMLДокумента.Документ.parentWindow

Для остальных браузеров через

Элементы.ПолеHTMLДокумента.Документ.defaultView


Подготовка переменных модуля для взаимодействия с JavaScript и вызов функции:

&НаКлиенте
Перем ДокументПервогоБраузера;

&НаКлиенте
Перем ОкноПервогоБраузера;

&НаКлиенте
Процедура ПервыйБраузерДокументСформирован(Элемент)
		
	// Сохранение элементов document и window в переменные модуля формы,
	// для последующего быстрого доступа к элементам и функциям.
	ДокументПервогоБраузера = Элемент.Документ;
	ОкноПервогоБраузера 	= ДокументПервогоБраузера.parentWindow; // IE
	Если ОкноПервогоБраузера = Неопределено Тогда
		ОкноПервогоБраузера = ДокументПервогоБраузера.defaultView; // Прочие браузеры
	КонецЕсли;

	ОкноПервогоБраузера.createButtons(МассивКнопокПервогоБраузера);

КонецПроцедуры

Подробнее остановимся на передаваемых агрументах.

В тонком клиенте под Windows, помимо примитивных типов Строка, Число, Булево.., в функцию JavaScript можно передавать и  нативные объекты 1С, такие как Структура, Массив, Соответствие, УправляемаяФорма, и др. Затем, в теле javascript функции доступны свойства и методы этих объектов.

Пример:

&НаКлиенте
Процедура СоздатьКнопки(Команда)
	
	МассивКнопок = Новый Массив;	
	...
	Для Сч = 1 По КоличествоКнопок Цикл
		...
		СтруктураКнопки = Новый Структура;
		СтруктураКнопки.Вставить("Заголовок", 		ЗаголовокКнопки);
		СтруктураКнопки.Вставить("ИмяКоманды", 		ИмяКоманды);
		СтруктураКнопки.Вставить("РазмерТекста", 	РазмерТекста);
		СтруктураКнопки.Вставить("ЦветТекста", 		ЦветТекста);
				
		МассивКнопок.Добавить(СтруктураКнопки);
	КонецЦикла;		
	
	ОкноПервогоБраузера.createButtons(МассивКнопок);
	
КонецПроцедуры
function createButtons(buttonsArray)
{
	var buttonsCount = buttonsArray.Количество(); // Доступны методы и свойства массива 1С
	for(var i = 0; i < buttonsCount; i++)
	{
		var ПараметрыКнопки = buttonsArray.Получить(i);

		var btn = document.createElement('div'); 
		btn.id 			= ПараметрыКнопки.ИмяКоманды; 
		btn.innerText 		= ПараметрыКнопки.Заголовок;	
		btn.style.fontSize 	= ПараметрыКнопки.РазмерТекста;			
		btn.style.color 	= ПараметрыКнопки.ЦветТекста;	
		 				
		container.appendChild(btn);                        
	}  
}  

Данный метод очень удобен, и он подходит, если хватает возможности работы в тонком клиенте в ОС Windows.

В тонком клиенте под Linux, а также в веб-клиенте метод не работает. При передаче структур, массивов, соответствий в аргумент функции, в её теле эти агрументы равны undefined. Работает передача строк, чисел, булев.

Решением возникшей проблемы является использование формата обмена данными JSON. Что это такое - см. https://ru.wikipedia.org/wiki/JSON

Массивы, Структуры и Соответствия преобразуются в их строковое представление, и передаются в функцию. Затем, в теле функции они преобразовываются в объекты языка javascript, такие как Array и Object.

Функции сериализации и десериализации в/из JSON:

&НаКлиенте
Функция СериализоватьВJSON(СериализуемыйОбъект)
	
	#Если ВебКлиент Тогда	
		СтрокаJSON = СериализоватьВJSONНаСервере(СериализуемыйОбъект);
	#Иначе
		ЗаписьJSON = Новый ЗаписьJSON; 
		ЗаписьJSON.УстановитьСтроку();
		НастройкиСериализации = Новый НастройкиСериализацииJSON();
		НастройкиСериализации.СериализовыватьМассивыКакОбъекты = Ложь;
		ЗаписатьJSON(ЗаписьJSON, СериализуемыйОбъект, НастройкиСериализации, "ПреобразованиеВJSON", ЭтотОбъект); 
		СтрокаJSON = ЗаписьJSON.Закрыть();
	#КонецЕсли
	
	Возврат СтрокаJSON; 

КонецФункции 

&НаСервереБезКонтекста
Функция СериализоватьВJSONНаСервере(СериализуемыйОбъект)
	
	ЗаписьJSON = Новый ЗаписьJSON; 
	ЗаписьJSON.УстановитьСтроку();
	НастройкиСериализации = Новый НастройкиСериализацииJSON();
	НастройкиСериализации.СериализовыватьМассивыКакОбъекты = Ложь;
	ЗаписатьJSON(ЗаписьJSON, СериализуемыйОбъект); 
	// ЗаписатьJSON(ЗаписьJSON, СериализуемыйОбъект, НастройкиСериализации, "ПреобразованиеВJSON", ЭтотОбъект); 
	//
	// ЭтотОбъект недоступнен в безконтекстном вызове, поэтому нужно либо поместить эту функцию в общий модуль, 
	// либо изменить директиву компиляции в &НаСервере
	СтрокаJSON = ЗаписьJSON.Закрыть();
		
	Возврат СтрокаJSON; 

КонецФункции 

&НаКлиентеНаСервереБезКонтекста
Функция ПреобразованиеВJSON(Свойство, Значение, ДополнительныеПараметры, Отказ) Экспорт
	
	// Данная функция вызывается для всех свойств, тип которых не поддерживает преобразование в формат JSON напрямую.
	// Они нам не нужны, поэтому всегда отказ от их записи.
	Отказ = Истина;	
	
	// Можно сделать преобразование в строку.
	// Значение = Строка(Значение);
	// Возврат Значение;
	
КонецФункции

&НаКлиенте
Функция ДесериализоватьИзJSON(СтрокаJSON)
	
	#Если ВебКлиент Тогда
		ДесериализованныйОбъект = ДесериализоватьИзJSONНаСервере(СтрокаJSON);
	#Иначе
		ЧтениеJSON = Новый ЧтениеJSON(); 
		ЧтениеJSON.УстановитьСтроку(СтрокаJSON); 
		ДесериализованныйОбъект = ПрочитатьJSON(ЧтениеJSON); 
		ЧтениеJSON.Закрыть();
	#КонецЕсли	
	
	Возврат ДесериализованныйОбъект;
	
КонецФункции

&НаСервереБезКонтекста
Функция ДесериализоватьИзJSONНаСервере(СтрокаJSON)
	
	ЧтениеJSON = Новый ЧтениеJSON(); 
	ЧтениеJSON.УстановитьСтроку(СтрокаJSON); 
	ДесериализованныйОбъект = ПрочитатьJSON(ЧтениеJSON); 
	ЧтениеJSON.Закрыть();
	
	Возврат ДесериализованныйОбъект;
	
КонецФункции

Используются механизмы работы с JSON, реализованные в платформе 8.3.6.1977.

Для платформы 8.3.5 и ранее, можно использовать разработку господина Александра Переверзева, доступную по адресу //infostart.ru/public/119601/.

Теперь, прежде чем передавать структуру в функцию JavaScript, преобразуем её в строку:

JSONМассивКнопокПервогоБраузера = СериализоватьВJSON(МассивКнопокПервогоБраузера);
ОкноПервогоБраузера.createButtons(JSONМассивКнопокПервогоБраузера);

Изменится и код функции Javascript, так как строку нужно преобразовать обратно в объект, пусть и не 1С-овский, но удобный для обработки:

function createButtonsWithJSON(buttonsData)
{
	var buttonsData = JSON.parse(buttonsData);
	
	for(var i in buttonsData)
	{
		var ПараметрыКнопки = buttonsData[i];

		var btn = document.createElement('li'); 
		btn.id = ПараметрыКнопки.ИмяКоманды; 
		...                                    
	}
}  

Глобальный объект JSON, используемый для сериализации и парсинга (десериализации) в javascript, доступен начиная с Internet Explorer 8.

HTML документ в тонком клиенте, по умолчанию, даже при наличии установленного IE11, отображается в режиме совместимости с IE5 (Quirks mode), поэтому необходимо его перевести в Standarts mode установной тега <meta http-equiv="X-UA-Compatible" content="IE=EDGE" /> в теле тега head.

Если на компьютере установлен IE7 (когда переход в режим минимум IE8 невозможен), то нужно использовать следующий скрипт: https://github.com/douglascrockford/JSON-js/blob/master/json2.js

который реализует функционал работы с JSON в IE < 8 (по аналогии с работой с JSON в платформе начиная с версии 8.3.6.1977, и до неё).

В функции javascript можно создавать массивы или объекты javascript, заполнять их, и возвращать в 1C.

&НаКлиенте
Процедура ПолучитьОбъектИзJavaScript(Команда)
	
	JSONСтруктураОтвета = ОкноПервогоБраузера.getDataFromJavaScript(""); 
	// Нужно передать любой параметр, например пустую строку, иначе функция не выполняется,
	// а переменной принимающей результат присваивается ссылка на эту функцию (COMОбъект).	
	СтруктураОтвета = ДесериализоватьИзJSON(JSONСтруктураОтвета);
	
	Для Каждого КлючИЗначение Из СтруктураОтвета Цикл
		Сообщить("Ключ: " + КлючИЗначение.Ключ + " Значение: " + КлючИЗначение.Значение);	
	КонецЦикла;
	
КонецПроцедуры
function getDataFromJavaScript()
{
	var arr = []; // Массив
	arr.push(555);
	arr.push("Строка в массиве");
	
 	var obj = {}; // Объект (структура)
 	obj["Ключ1"] = "Пробная строка";
 	obj["Ключ2"] = 7777;
 	obj["Ключ3"] = true;
 	obj["Ключ4"] = arr;
 	
 	return JSON.stringify(obj);
}

Вызов методов 1С из JavaScript

В тонком клиенте под Windows доступен очень удобный метод:

В HTML документе создается глобальная переменная, например externalForm. При загрузке документа, переменной externalForm присваивается ссылка на текущую упрваляемую форму, доступную через ЭтотОбъект или ЭтаФорма.

Затем, в коде JavaScript становятся доступны любые клиентские экспортные методы и переменные модуля данной управляемой формы.

Пример:

// В документе html, в теге script объявляем глобальную переменную.
var externalForm = null;
var timer = null;
var counter = 0;

function startTimer() 
{        
    alert(externalForm.ПеременнаяМодуля);
            
    timer = setInterval(function() 
    {
        externalForm.МетодВызываемыйИзJavaScript("Значение переменной conunter: " + counter++);
    }, 1000);
}

function stopTimer()
{
    clearInterval(timer);
}
&НаКлиенте
Перем ПеременнаяМодуля Экспорт;

&НаКлиенте
Процедура ПриОткрытии(Отказ)
    
    ...
    ПеременнаяМодуля = "Значение переменной модуля";
    
КонецПроцедуры

&НаКлиенте
Процедура ПервыйБраузерДокументСформирован(Элемент)
	
	...		
	ОкноПервогоБраузера.externalForm = ЭтаФорма;
	
КонецПроцедуры

&НаКлиенте
Процедура ЗапуститьТаймер(Команда)
	
	ОкноПервогоБраузера.startTimer();
	
КонецПроцедуры

&НаКлиенте
Процедура ОстановитьТаймер(Команда)
	
	ОкноПервогоБраузера.stopTimer();
	
КонецПроцедуры

&НаКлиенте
Процедура МетодВызываемыйИзJavaScript(Данные) Экспорт
    
    Сообщить(Данные);
    
КонецПроцедуры

В тонком клиенте на Linux и в веб-клиенте методы и свойства переменной externalForm не доступны в javascript, их значение - undefined, поэтому используется следующая методика:

Объявляем глобальную переменную javascript, в которую будем помещать передаваемое значение.

var interactionVariable = null;

В документ добавляем невидимую кнопку

<button id="interactionButton" style="display: none">Кнопка взаимодействия</button>

Присваиваем передаваемое значение, например имя необходимой функции или любое другое значение, переменной interactionVariable и вызываем нажатие невидимой кнопки.

interactionVariable = "МетодВызываемыйИзJavaScript через interactionButton. Значение переменной conunter: " + counter;
interactionButton.click();

И обрабатываем событие ПриНажатии у поля HTML документа.

&НаКлиенте
Процедура ПервыйБраузерПриНажатии(Элемент, ДанныеСобытия, СтандартнаяОбработка)
	
	НажатыйЭлемент = ДанныеСобытия.Element;
	Если НажатыйЭлемент.id = "interactionButton" Тогда
		МетодВызываемыйИзJavaScript(ОкноПервогоБраузера.interactionVariable);
		
		// Или: Заглушка = Вычислить(ОкноПервогоБраузера.interactionVariable + "()");
		// Поле для фантазии большое	
	КонецЕсли;
	
КонецПроцедуры

Благодарю за внимание, не претендую на уникальность и надеюсь, что и данная информация будет полезна многим.

Прикреплена демонстрационная обработка.

javascript html 1c взаимодействие

См. также

Богатый редактор картинок, хранимых в базе, с возможностью РИСОВАНИЯ. Редактор внешних файлов картинок. Объект, расширяющий возможности работы с картинками из встроенного языка (Три в одном) + Обработка «Стандартизация картинок»

Работа с интерфейсом Рабочее место Платформа 1С v8.3 Управляемые формы Конфигурации 1cv8 Платные (руб)

Обработка предназначена для редактирования картинок в режиме «Предприятие», с возможностью РИСОВАТЬ на них. Поддерживается работа как в обычных формах (толстый клиент) так и на управляемых формах (тонкий клиент). Обработка позволяет редактировать как картинки, хранимые в базе, так и графические файлы с диска на файловой системе. Помимо базовых функций (изменение размеров, преобразование формата, обрезание картинки, повороты и т.п.) – редактор имеет богатый набор инструментов для рисования. Доступна функция вставки изображения из буфера обмена. Также обработка может быть использована из встроенного языка как объект для редактирования картинок. Объект может быть использован: на стороне клиента, на стороне сервера, из внешнего соединения. Данная обработка будет особенно полезна тем, кто вносит картинки в базу (изображения номенклатуры, фотографии физических лиц и т.п.). Функционал реализуется с использованием JavaScript и бесплатного ПО ImageMagick (без использования внешних компонент).

6000 руб.

16.01.2015    61797    43    59    

80

[Расширения] Динамическое управление видимостью и доступностью элементов форм (УФ) (8.3.6+)

Работа с интерфейсом Платформа 1С v8.3 Управляемые формы Конфигурации 1cv8 Платные (руб)

Механизм «Динамическое управление доступом к элементам форм объектов 1С8» предназначен для обеспечения возможности оперативного управления видимостью и доступностью элементов форм документов и справочников продуктов фирмы «1С» «1С:Предприятие 8». Решение универсальное, встраивается в любую конфигурацию с минимальными доработками, что позволяет без проблем обновлять типовые решения.

5000 руб.

14.01.2016    54403    16    21    

42

Управление дашбордами

Работа с интерфейсом Платформа 1С v8.3 Конфигурации 1cv8 Платные (руб)

Обработка предназначена для создания и управления дашбордами.

2400 руб.

29.06.2020    16698    21    4    

35

Новогоднее оформление для 1С

Работа с интерфейсом Платформа 1С v8.3 1С:Бухгалтерия 3.0 1С:Управление торговлей 11 1С:Зарплата и Управление Персоналом 3.x 1С:Управление нашей фирмой 3.0 Бесплатно (free)

Добавьте новогоднего настроения! Расширение создает декорацию в виде гирлянды на некоторых формах объектов.

27.12.2023    10738    750    elcoan    45    

106

Конструктор HTML, CSS и javascript

Инструментарий разработчика Работа с интерфейсом Платформа 1С v8.3 Конфигурации 1cv8 Абонемент ($m)

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

2 стартмани

10.04.2023    9615    151    acces969    31    

118

Модель состояния для MVC

Работа с интерфейсом Платформа 1С v8.3 Конфигурации 1cv8 Абонемент ($m)

"MVC плохо применима в 1С" - познакомьтесь с моделью состояния и, возможно, ваше мнение поменяется! Представленное решение является эволюционным развитием идеи реализации MVC для 1С. В новой версии добавлены DSL для описания модели состояния, а также параметризация свойств параметров и элементов формы.

1 стартмани

05.07.2022    3666    kalyaka    2    

27

Табло очереди заказов на экран телевизора

WEB-интеграция Работа с интерфейсом Платформа 1С v8.3 1С:Розница 2 Платные (руб)

Связка из веб-приложения и расширения для 1С: Розница 2.3.

3600 руб.

29.04.2022    12080    1    5    

10
Комментарии
В избранное Подписаться на ответы Сортировка: Древо развёрнутое
Свернуть все
1. VitaliyCeban 461 14.09.15 11:59 Сейчас в теме
Еще один интересный приём передачи данных JavaScript -> 1C, работающий только в тонком/толстом клиентах на Windows.

function call1C()
{
	var obj = externalForm.ВычислитьКод1СИзJavascript("Новый Структура");
	obj.Вставить("ПолеСтруктуры", "Значение поля стурктуры");
	externalForm.МетодВызываемыйИз1С(obj);
}

&НаКлиенте
Функция ВычислитьКод1СИзJavascript(Код) Экспорт
	
	Возврат Вычислить(Код);
		
КонецФункции

&НаКлиенте
Функция МетодВызываемыйИз1С(Данные) Экспорт
	
	Сообщить(Данные.ПолеСтруктуры);
		
КонецФункции
Показать
JohnyDeath; fancy; le0nid; json; WizaXxX; Gilev.Vyacheslav; zergnm; kote; +8 Ответить
23. unpete 577 21.09.15 15:58 Сейчас в теме
(1) Ремарка: события на вебстранице возникают асинхронно, форма 1С, в общем случае, может какие-то из виртуальных кликов пропустить. Тип переменной interactionVariable лучше сделать строкой и не просто присваивать, а дописывать в неё json очередного сообщения. На стороне формы 1С реализовать очередь, в которую складывать элементы массива из interactionVariable и последовательно обрабатывать.
user1011519; kote; +2 Ответить
24. VitaliyCeban 461 22.09.15 09:13 Сейчас в теме
(23) unpete, Хоть и не замечал пропусков, но ваш метод всё же, более надёжен, спасибо. Одно непонятно, как поведет себя одновременный .pop() у этого стека в 1С, и .push() в javascript, при отсутствии mutex'ов.
25. unpete 577 22.09.15 12:24 Сейчас в теме
(24) В моих проектах пропуски были решение из практики.
как поведет себя одновременный .pop() у этого стека в 1С, и .push() в javascript
Поведёт себя плохо, решение не идеальное, но вероятность проблем ниже.
34. Alxby 1136 26.12.16 08:17 Сейчас в теме
(23), (24) Хотел было написать комментарий о механизме обмена, но потом решил оформить его отдельной статьей http://infostart.ru/public/570446/
fillin; salamankas; VitaliyCeban; +3 Ответить
55. diziburda1 21.05.20 17:07 Сейчас в теме
(1)hello is there any english document ? I didnt understand it :) Basicly i need when i click a event in html document i want to start 1c procedure or function how can i do it ?
2. kote 536 14.09.15 17:23 Сейчас в теме
Прочитал с большим интересом :) В своё время "подружил" HTML-форму c Flash элементом на нём - с передачей данных туда и обратно.. но потом flash умер и всё как то сошло на нет :)
В общем, управляемые формы уже не мучал в этом отношении.

Пишите еще. Интересно, насколько можно улучшить UI у 1С с помощью js - фото и видео бы добавить в следующих статьях.. и посмотреть работу таких фреймворков в окне 1С, как Angular/React/.. и т.п.

Жму руку и буду ждать продолжения..
user1201038; +1 Ответить
5. VitaliyCeban 461 14.09.15 22:00 Сейчас в теме
(2) kote, Постараюсь написать полезный материал.

(3) yurii_host, Функции javascript объявляются в HTML документе, между тегами <sc ript> </sc ript>
Простейший пример https://learn.javascript.ru/hello-world.

Исходный код HTML документа можно хранить в макете типа ТекстовыйДокумент. Хотя есть и макет типа Документ HTML, с мгновенным просмотром результата изменений, но хранить код в нем не советую, так как конфигуратор портит код, работающий с новыми версиями браузеров.

Создаете реквизит формы, с типом Строка, переностите его на форму, изменяете тип элемента с Поле ввода на Поле HTML документа. Получаете содержимое макета ТекстовыйДокумент и присваиваете его созданному реквизиту с типом Строка.

(4) vano-ekt, Нужно указывать мета-тег x-ua-compatible для перевода браузера в Standards mode, тогда документ будет отображаться в режиме версии, установленной на компьютере. Тег присутствует в статье. Проблема реальна, когда сборка Windows на компьютере старая, и установлен IE8, или IE7. Поэтому нужно писать разметку HTML таким образом, чтобы обеспечивать совместимость и с этими браузерами.

Для решения которое я разрабатываю, я выбрал минимальный порог - IE8. То есть, если хотите чтобы приложение работало, обновите ваш IE6/7 до IE8, так как для поддержки IE7 нужно слишком много костылей. Такой же порог выбрали и разработчики 1С для веб-клиента.

Надо сделать коллективное обращение в 1С, об отказе использования IE WebContol в толстом/тонком клиентах под Windows, и переход на Webkit, с вшитием его в платформу, то есть чтобы версия Webkit не зависела от того что установлено на компьютере.
7. vandalsvq 1537 15.09.15 03:05 Сейчас в теме
(5) указание совместимости - это лишь костылек, который в полной мере не решит проблему. Большинство современных java- библиотек поддерживаться будут крайне ограниченно или вообще никак (поскольку большинству надо хотя бы IE8+). На текущий момент работу в 1С с java лично для себя немного закрыл, в пользу связки web-приложение + http сервисы. Да есть ряд неудобств, но пережить можно. По крайней мере пока webkit не появится. Хотя тут тоже такой нюанс, пока 1С добавит, пока платформа выйдет, пока займет значимую часть среди пользователей ))))). В общем не скоро будет оное ))))
8. minimajack 80 15.09.15 08:01 Сейчас в теме
(7) vandalsvq, ХВАТИТ ПУТАТЬ.
java - никакого отношения к javascript не имеет ВООБЩЕ.
acvatoris; ivv1970; user1021675; kild; +4 Ответить
11. vandalsvq 1537 15.09.15 23:50 Сейчас в теме
(8) minimajack, слушай, если я для упрощения печатания написал java (хотя понятно контексту общения о чем идет речь) что теперь на гильотину? Сейчас уже исправить не могу, но сразу говорю, что имел в виду javascript.
(10) ну вот не знаю, не знаю. Ты это, например, ангулару (1.4) скажи с его директивами вроде ng-if, которые при использовании вываливают 1С на бок. Тестил правда всего на нескольких релизах (8.3.6.2ххх, 8.3.5.ххх - не помню точно), но так и было. На компе стоит ie "припоследнейший", вот винда только 7-я, но она то не при чем? Кстати эти же странички прекрасно работают в ie (правда как всегда для оформления в css приходится хаки использовать), про гугл и сафари молчу, там понятно что все путем. Так что, по чем купил, по тому и отдаю.
Готов предоставить для тестирования код.

Пы.сы. интересная идея возникла, попробовать накидать тестовую страничку для проверки директив ангулара... как найдется минутка накидаю.
10. VitaliyCeban 461 15.09.15 09:12 Сейчас в теме
(7) vandalsvq, Указание использовать последний доступный Standards mode решает проблемы. Библиотеки работают, так, как нужно.
Как я описал выше, проблема действительно присутствует когда у пользователя просто не установлен на компьютере IE8+.

(6) logarifm, Успокойтесь, отбросьте негатив, попробуйте javascript, весьма вероятно - Вам понравится.
17. kote 536 17.09.15 09:32 Сейчас в теме
(5)
Надо сделать коллективное обращение в 1С, об отказе использования IE WebContol в толстом/тонком клиентах под Windows, и переход на Webkit, с вшитием его в платформу, то есть чтобы версия Webkit не зависела от того что установлено на компьютере.


.. и более того - учитывая сколько геморроя.. не СКОЛЬКО ГЕМОРРОЯ доставляет web-клиент, когда у пользователей постоянно обновляется Хром/Фаерфокс.. может, вообще стоит выпустить СВОЮ СБОРКУ хрома/фаерфокса - которая будет гарантированно работать с 1С через web?

Ведь загвоздка, на самом деле - хоть тонкий клиент и весит меньше, чем дистрибутив броузера - проблема в правах на установку и зависимости тонкого клиента от версии платформы на сервере.. Ну сделали бы как то - вариантов море - например, тонкий клиент, портабельный/не требующий установки - распаковал и работай.. или обновление чтобы не требовало прав на установку ПО.. или вообще - чтоб тонкий клиент не требовал соответствия версии сервера и своей (т.е. по сути специализированный такой броузер базы 1С)..
18. unpete 577 17.09.15 20:58 Сейчас в теме
(5)
Надо сделать коллективное обращение в 1С, об отказе использования IE WebContol
Подобные обращения писались многократно. Цитирую дословно ответ С. Нуралиева с весеннего партнерского семинара 2015 года: "Это сложно и очень опасно".
и переход на Webkit

Лучше, не базовый Webkit, а Blink с движком V8 (Chromium) - поддержка ES6-ES7 там намного лучше. Например, Object.Observe() или ServiseWorkers работают только в V8. В других javascript движках еще даже не анонсированы.

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

(6) logarifm,
Так почему продолжаем стонать и упорно лезть на кактус, работайте на других системах
Платформа 1С содержит гениальные объекты данных. Про регистр, документ, справочник и ссылочную типизацию можно говорить только в превосходной степени.
При этом, та же платформа содержит серьёзные архитектурные ошибки в модели тонкого и веб-клиентов. Эти проблемы не решить рефакторингом или оптимизацией, т.к. их корни в постановке задачи, а не в реализации. Попытки применить педали и костыли - естественны. Перед людьми возникают задачи и они пытаются их решать используя доступные в платформе средства.
почему не стать одним из разработчиков

Так и поступили. См. metadata.js
dvsidelnikov; DAAbramov; manuel; salamankas; Makushimo; VitaliyCeban; kote; +7 Ответить
22. kote 536 21.09.15 11:17 Сейчас в теме
for all, (18) unpete,

Всем рекомендую посмотреть на metadata.js - из 18 поста.. И задумка и исполнение на высоте. Правда, не бесплатно для коммерческого использования - но посмотреть стоит.
3. json 3297 14.09.15 21:01 Сейчас в теме
Очень интересная статья. Автору респект за развитие направления по расширению возможностей 1С.

Не смог понять из описания, где хранится код на жабаскрипте.
Если я хочу объявить, например, javascript-функцию, то где конкретно я должен прописать ее код?
4. vano-ekt 123 14.09.15 21:14 Сейчас в теме
ПолеHTMLДокумента ис суксь, ибо ie6 или какой там
6. logarifm 1117 14.09.15 23:56 Сейчас в теме
не могут в полной мере удовлетворить потребность в богатом и отзывчивом интерфейсе


А вы значит можете??? Тоесть вы думаете, что добавив эту пидаль и вуаля 1С вдруг стала красивей. Ну если Вы такой крутой и можете критиковать 1С так почему не стать одним из разработчиков этой 1С и исправить то что вам не нравиться.

Если проанализировать ИС то 80% статей начинается, 1С не сделала то. 1С криво сделала это... Так почему продолжаем стонать и упорно лезть на кактус, работайте на других системах...
9. json 3297 15.09.15 08:54 Сейчас в теме
(6) logarifm,
javascript - это не педаль и не костыль. Разработчики из фирмы 1С тоже используют javascript в типовых конфигурациях (БП 2.0, ЗУП). Некоторые вещи 1с-кой не реализуешь (например, предпросмотр при наведении, некоторые виды диаграмм и др.) типовыми средствами. Но применение таких рюшечек повышает привлекательность и удобство интерфейса.

и еще один факт. Над улучшением возможностей платформы 1С работает только одна фирма 1С, а сообщество javascript - по всему миру. Очевидно, что javascript - развивается интенсивнее.

думаю, для того, чтобы высказывать подобные замечания объективно, вам явно не хватает знаний в области возможностей этого языка.
Andreyyy; SeiOkami; Gendelf; manuel; dmpas; Chif13; Gilev.Vyacheslav; sikuda; amon_ra; unpete; Taktic; infostart user; fvadim; slavap; FSerg; VitaliyCeban; +16 Ответить
12. TuneSoft 247 16.09.15 08:12 Сейчас в теме
Интересно, но всё это неактуально для мобильного приложения на 1С :(
gigapevt; kvovka; +2 Ответить
14. kvovka 32 16.09.15 08:31 Сейчас в теме
(12) tunesoft, вот именно. Ждем, когда заработает на мобильной платформе.
19. unpete 577 17.09.15 21:07 Сейчас в теме
(12) tunesoft, (14) kvovka,
Ждем, когда заработает на мобильной платформе
Два вопроса:
  • Можно пример задачи для которой из мобильной платформы нужен доступ к браузеру?
  • Почему бы эту задачу не решить прямо в браузере?
27. kvovka 32 30.09.15 08:07 Сейчас в теме
(19) unpete, клиентов все устраивает в мобильном, кроме интерфейса.
13. Makushimo 160 16.09.15 08:20 Сейчас в теме
Наконец-то появляются статьи на тему использования html в 1C.
Автор, спасибо

Вопрос, на который не могу найти ответ. Может подскажете

Как в 1С в поле html документа сделать раскрывающийся текст ?
ну вот как на этом сайте цитаты кода 1С отображаются:
небольшой спойлер, нажимаешь на "показать" или на заголовок спойлера и разворачивается весь текст внутри.
16. vandalsvq 1537 16.09.15 14:11 Сейчас в теме
(13) Makushimo, jQuery тебе в помощь. Там есть метод show смотри в его сторону.
В html будет примерно так

// HTML
<h1 id='blockctrl'>Показать</h1>
<div id='hideblock' style='display:none'>Тут содержимое блока</div>

// JS
$("#blockctrl").click(
    function() {
        $("#hideblock").show("slow");
    }
);
Показать
15. iliabvf 16.09.15 10:14 Сейчас в теме
Большое спасибо! Как раз была идея полностью заменить интерфейс Такси на дизайнерский из html + css + js.
Как заметили выше, с мобильным приложением все хуже.

Буду ждать продолжения.
20. olbu 18.09.15 13:57 Сейчас в теме
открываю под 8.2 обычное приложение вот это <Окно документа>.funcName(funcArgs);, у меня вываливается ошибка
{Форма.Форма.Форма(153)}: Метод объекта не обнаружен (fff)
Браузер.fff("ГГГГГ");
получается в моем случае не видно функции fff...

<script>
function fff(M) {alert(M);}
</script>
21. VitaliyCeban 461 21.09.15 09:30 Сейчас в теме
(20) olbu, Загрузите обработку на файловый хостинг, могу посмотреть в чём проблема. И напишите версию IE, установленную на компьютере. А также, через какой клиент запускаете.
26. sikuda 673 24.09.15 18:22 Сейчас в теме
Чашечка с кофе это эмблема java, а не javascript. Не путайте пожалуйста.

Hitler And The Downfall Of Silverlight
https://youtu.be/RRFiu0xfQzw
28. quick 583 30.09.15 10:20 Сейчас в теме
превосходный пример, как раз то что нужно. Надоело писать интерфейсы под все версии.
29. alprk 23.11.16 11:17 Сейчас в теме
ПараметрыКнопки = buttonsArray.Получить(i);


var ПараметрыКнопки
30. VitaliyCeban 461 23.11.16 12:25 Сейчас в теме
(29) alprk, Дополнено, спасибо.
31. anig99 2843 09.12.16 14:18 Сейчас в теме
Для УФ (управляемых форм) есть одно замечание.
ОкноПервогоБраузера.externalForm = ЭтаФорма;
использовать нельзя. Это циклическая ссылка и при закрытии клиента всё остается висеть в памяти и на сервере. Неизвращенными способами обойти это нельзя. Гораздо проще переделать на ПриНажатии, как описано здесь http://infostart.ru/public/338126/

Для простых форм циклическая ссылка - тоже зло, но там реально наплодить костылей, чтобы циклическую ссылку устранить при закрытии клиента.
32. VitaliyCeban 461 09.12.16 15:21 Сейчас в теме
(31) А если в ПередЗакрытием вызвать ОкноПервогоБраузера.externalForm = null; ? Счетчик ссылок должен уменьшиться.

Метод ПраНажатии описан в этой статье, правда уклон я сделал на его кроссплатформенность. В тиражном решении использую только его (из за упомянутой кроссплатформенности).
33. anig99 2843 12.12.16 14:33 Сейчас в теме
(32) если есть циклическая ссылка, то окно закрывается только визуально, т.к. закрывается родительское окно клиента 1с. Фактически же окно не закрывается, оставаясь в памяти компьютера и сервера. Соответственно ни ПередЗакрытием, ни ПриЗакрытии не запускаются. Я несколько часов потратил на обдумывание, как это можно обойти в тонком клиенте, но понял, что эффективнее потратить время на переделку на ПриНажатии.
41. pencil 24.05.17 00:54 Сейчас в теме
(33) Проверил, ПередЗакрытием прекрасно запускается. Да и было бы странно, если бы нет, это же ПЕРЕД закрытием, оно в принципе должно запускаться когда объект формы еще существует.

К сожалению, вызов функций 1С через ПриНажатии не всегда возможно использовать. Обнаружил тут, что если веб-документ построен на фреймах (не в смысле <iframe> используется, а на <frameset>. Да, есть извращенцы, которые до сих пор так делают) то это событие у поля HTML вообще не вызывается.
35. Lord_Alexandr 27.01.17 17:04 Сейчас в теме
Пытаюсь в браузере Chrome v55.x.x.x вызвать глобальную javascript-функцию через
ДокументПервогоБраузера.defaultView.<ИмяМетода>();
Получил сообщение 1С: Метод объекта не обнаружен <ИмяМетода>.
При этом доступ к глобальным javascript-переменным есть. А с вызовами ошибка.
Что я делаю не так?

Через ДокументПервогоБраузера.parentWindow в IE и тонком/толстом клиентах работает все прекрасно.
36. json 3297 28.01.17 11:01 Сейчас в теме
(35) очень интересно. А можно вас попросить выложить пример кода по созданию ком объекта хрома?
Насколько мне известно сам хром (и другие браузеры кроме ие) не имеют ком интерфейса. Вы наверное какую-нибудь стороннюю dll используете?

Я бы тоже поэкспериментировал в этом направлении
38. VitaliyCeban 461 30.01.17 11:42 Сейчас в теме
(36) COMОбъект в случае веб-клиента (не IE) не используется. Насколько помню, ДокументПервогоБраузера.defaultView имеет тип ВнешнийОбъект.
39. Lord_Alexandr 24.02.17 15:08 Сейчас в теме
(36) Я использую механизм описанный в данной статье, никакого com-объекта тут нет. Обращение в web-клиенте идет через iframe.
Проблема в том, что в W3C браузерах document ничего не знает о window, поэтому о parentWindow не может быть и речи, а defaultView немного иной объект. Видимо потому вызов глобальных функций не работает у меня.
37. VitaliyCeban 461 30.01.17 11:40 Сейчас в теме
(35) Если выложите обработку, в которой воспроизводится проблема, смогу посмотреть.
40. Lord_Alexandr 24.02.17 15:15 Сейчас в теме
(37) Обработка изначальна была проста как валенок, т.к. делал исходя из статьи.
Сейчас уже решил проблему не через вызов глобальных функций window, а через запись всех параметров в глобальную javascript-переменную и генерацию события click специальной скрытой кнопки. А уже в javascript-обработчике click анализирую содержимое глобальной переменной и выполняю необходимые действия.
42. fillin 244 10.06.17 00:02 Сейчас в теме
Спасибо за статью. Очень помогла.
Внесу свои 5 копеек.

1. Часто интерфейсы библиотек JS реализуют как функции. Примерно так:
(function(){
	// Внутренняя реализация
	...
	// Интерфейс
	var moduleInterface= function(){};
	...
	// Экспорт
	window.moduleName = moduleInterface;
}());
Показать

В JS обращение к свойствам и методам библиотеки происходит, как обычно, через точку: moduleName.method()
Но в 1С в этом случае надо обращаться к модулю, как к функции: moduleName().method()

2. Сделал заменитель запрещенной функции eval - аналог Выполнить и Вычислить в 1С.
(function(moduleName){
	"use strict";

	/**
	 * Выполняет код, полученный из строки code с параметрами paramsDesc в контексте context.
	 * Параметры, описанные в paramsDesc передаются в аргументах, начиная с 4-го.
	 *
	 * Примеры использования:
	 *	executeCodeFromString('', 'console.log("Hi!")')(); // Hi!
	 *	executeCodeFromString('a, b', 'return a + b', null, 1, 2); // 3
	 */
	function executeCodeFromString(paramsDesc, code, context) {
		var func = new Function(paramsDesc, code);
		return func.apply(context || window, [].slice.call(arguments, 3));
	}

	var moduleInterface = function(){};
	moduleInterface.executeCodeFromString = executeCodeFromString;

	// Экспорт
	window[moduleName||"myModule"] = moduleInterface;

}(/*Здесь можно переопределить внешнее имя модуля*/));
Показать

Пример использования:
	// Объявим короткое имя
	jsWindow = Элементы.ДокументHTML.Документ.parentWindow;
	myModule = jsWindow.myModule();

	// Выполним проивольный код на стороне JavaScript
	myModule.executeCodeFromString("", "alert('Привет!')");
	// Передадим произвольный контекст в 3-м параметре
	Сообщить(myModule.executeCodeFromString("", "return this.ИмяФормы", ЭтотОбъект));  // ВнешнийОтчет.ВнешнийОтчет1.Форма.Форма
	
	// Вычислим что-нибудь с передачей параметров
	Сообщить(myModule.executeCodeFromString("a, b, c", "return Math.max(a, b, c)", , 1, 5, 4));  // 5
	// Опишем новую функцию на стороне JS, а потом вызовем ее
	myModule.executeCodeFromString("", "myModule.sum = new Function('a, b', 'return a + b  //Это могла бы быть очень большая функция ')");
	Сообщить(myModule.executeCodeFromString("a, b", "return myModule.sum(a, b)", , 4, 10));  // 14
	Сообщить(myModule.executeCodeFromString("", "return myModule.sum(this.Высота, this.Ширина)", Элементы.ДокументHTML));  // У меня получилось 60
Maximysis; fancy; logos; pahalovo; pm74; VitaliyCeban; +6 Ответить
43. kild 89 08.10.17 20:35 Сейчас в теме
Плюс за статью.
Только уберите, пожалуйста, лого чашки кофе. Java к JavaScript'у никакого отношения не имеет. У JavaScripta есть свое лого. Из-за таких вот ляпов в других ресурсах ржут над одинэсниками.
Boris_1c; ivv1970; CyberCerber; +3 Ответить
44. TylerDerdenIII 18.01.18 10:39 Сейчас в теме
В веб-клиенте Элементы.ДокументHTML.Документ = Неопределено. В толстом/тонком все норм. В чем может быть дело?
45. json 3297 18.01.18 11:15 Сейчас в теме
(44) Возможно, что Поле HTML не отображается на форме (либо Видимость = ЛОЖЬ, либо располагается на невидимой закладке).
48. vladnet 361 16.10.19 10:15 Сейчас в теме
(44) Никто не нашел решения данной проблемы?

В веб-клиенте Элементы.ДокументHTML.Документ = Неопределено

это просто засада, все работает в а веб клиенте нет
46. frkbvfnjh 785 09.10.19 13:52 Сейчас в теме
&НаКлиенте
Процедура ПервыйБраузерДокументСформирован(Элемент)
    
    ...        
    ОкноПервогоБраузера.externalForm = ЭтаФорма;
    
КонецПроцедуры


В тонком клиенте, на платформе 8.3.15.1565 (даже под Windows) - не работает! Значение не меняется при присвоении формы, но если к примеру присвоить простой тип (число или строку), то значение в переменной меняется, так что прикрыли лавочку походу...
47. vladnet 361 16.10.19 10:14 Сейчас в теме
(46) Скорее всего это из за того что сейчас используется webkit, он не может так как эксплорер ссылки поддерживать на непонятные объекты
TuneSoft; +1 Ответить
49. Бэнни 203 01.12.19 11:29 Сейчас в теме
(47) и чего делать в таком случае?
50. Бэнни 203 02.12.19 04:22 Сейчас в теме
(49)разобрался, проще генерить события в js, и программно нажимать на невидимую кнопку, а она уже сама вызовет событие элемента "ПриНажатии" и там уже все разруливать.
51. s_vidyakin 63 26.12.19 17:59 Сейчас в теме
Прикрутил vue.js к странице, удобно передавать обычный массив данных, а Vue передает в компонент и красиво выводит
VitaliyCeban; +1 Ответить
52. OptimusMaximus 14.01.20 11:23 Сейчас в теме
А если к примеру нужно написать регламентное задание по обмену например есть решение на java
далее утыкаемся в то что элемента на форме мы разместить не можем а и соответствено вызвать функцию
Для браузера Internet Explorer окно документа доступно через

Элементы.ПолеHTMLДокумента.Документ.parentWindow
Для остальных браузеров через

Элементы.ПолеHTMLДокумента.Документ.defaultView
53. VitaliyCeban 461 16.01.20 00:19 Сейчас в теме
54. diziburda1 21.05.20 15:54 Сейчас в теме
hello is there any english document ? I didnt understand it :) Basicly i need when i click a event in html document i want to start 1c procedure or function how can i do it ?
56. VitaliyCeban 461 21.05.20 17:15 Сейчас в теме
(54)

In html document create a global variable like
var interactionVariable = null;


Then create an invisible button
<button id="interactionButton" style="display: none">Interaction button</button>


At any place you want to call 1C from Javascript, run these two strings of code:

interactionVariable = "assign here your data, it can be, for example, JSON.stringify(myObject)";
interactionButton.click();


And in 1C form, HTML document has only 2 events: DocumentComplete and OnClick.
You need the second one.

&AtClient
Procedure WebBrowserOnClick(Element, EventData, ....)
    
    ClickedElement = EventData.Element;
    If ClickedElement.id = "interactionButton" Then
        MyData = Elements.WebBrowser.defaultView.interactionVariable; // or parentWindow, instead of defaultView, for IE and platform ver. < 8.3.14
        // Do anything you want with MyData
           
    EndIf;
    
EndProcedure
Показать
eeeio; Artem-B; +2 Ответить
57. VitaliyCeban 461 21.05.20 17:18 Сейчас в теме
(54) If you used JSON.stringify at Javascript side, then you can parse it back from MyData variable to an object, at 1C side, with 1C's JSONReader
58. diziburda1 21.05.20 18:35 Сейчас в теме
59. Vix 28 17.07.20 22:52 Сейчас в теме
столкнулся с тем, что в тонком и веб клиенте ДокументПервогоБраузера.defaultView, Поле HTML.document = Неопределено. Не понятно почему возникает это, платформа 8.3.15 с режимом совместимости 8.3.12. Причем изначально с первого раза все работало, спустя неделю уже перестало.
60. Viktor_Ermakov 363 11.08.21 09:25 Сейчас в теме
появился webkit, думаю пора обновить статью!)
61. polach 30.08.21 09:07 Сейчас в теме
Подскажите пожалуйста как мне обработать в 1с CallBack от JS. Теперь подробнее. Хочу получить видео с веб камеры для этого обращаюсь к веб камере через navigator.mediaDevices.getUserMedia - это стандартная функция JS. Она вызывает обращение к пользователю ввиде диалога где спрашивает разрешить доступ к камере Да/Нет. Этот диалог выходит в браузере но в 1с в поле Html ничего не происходит. Вот вопрос как можно обработать ответ для это функции в 1с.
62. VitaliyCeban 461 01.09.21 09:29 Сейчас в теме
(61) 99.99% что работа с веб-камерой просто вырезана из WebKit, встроенного в платформу 1С (как, например, достоверно известно, что вырезана поддержка WebGL). Ответ - никак.
63. polach 02.09.21 16:53 Сейчас в теме
64. user635667 137 17.11.21 12:39 Сейчас в теме
Здравствуйте. Простой вопрос у меня, не могу разобраться. Не по теме топика, но рядом. В общем делаю приложение для смартфона. Я сделал форму, на нее вынес реквизит "Сайт" с типом "Строка". Вид HTML документ. И в него вывожу интернет страницу.
Я убрал галочку "Доступность" реквизита. Это дало следующий эффект - сайт из интернета загружается, но нажимать на ссылки в этом сайте нельзя. Это на ПК. А вот на мобильной платформе на ссылки нажимать можно, хотя на ПК было нельзя!!!
Галочка "Только просмотр" имеет такой же эффект.
Как такое возможно и как с этим бороться?
65. Steelvan 302 27.04.22 11:09 Сейчас в теме
Изучать js для сопряжения с обозревателем это здорово, однако следует понимать, что js это совсем другая парадигма программирования.
Например,

https://youtu.be/9WtG6SWK7dM
Оставьте свое сообщение