Интеграция TinyMCE в 1С

07.02.11

Интеграция - WEB-интеграция

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

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

Как вставить текст в TinyMCE при запуске редактора?

В HTML-файле редактора обязательно присутствует элемент textarea, к которому и прикрепляется редактор TinyMCE в виде оболочки. В этот элемент надо вставить свой текст, например:

<textarea id="content" name="content" style="width:100%">тут ваш текст</textarea>

Вставить можно различными способами, например поиском и заменой текста в файле.

Как вставить HTML в TinyMCE программно?

JScript = "tinyMCE.activeEditor.execCommand('mceInsertContent',false,'" + Текст + "');";
ПолеHTMLДокумента.Документ.parentWindow.ExecScript(JScript,"JavaScript");

Как создать ссылку из выделенного текста в TinyMCE?

JScript = "
|text = tinyMCE.activeEditor.selection.getContent(" + Формат + ");
|tinyMCE.activeEditor.selection.setNode(tinyMCE.activeEditor.dom.create('a', {href : '" + ТекстСсылки + "'}, text));";
ПолеHTMLДокумента.Документ.parentWindow.ExecScript(JScript,"JavaScript");

Как получить введенный HTML из редактора TinyMCE? 

HTMLКонтент = ПолеHTMLДокумента.Документ.parentWindow.eval("tinyMCE.activeEditor.getContent()"); 

Как получить выделенную область в TinyMCE?

Чтобы получить выделенный текст выполните команду:

ВыделенныйТекст = ПолеHTMLДокумента.Документ.parentWindow.eval("tinyMCE.activeEditor.selection.getContent()"); 

Чтобы получить ноду выделенной области выполните команду:

Нода = Редактор.Документ.parentWindow.eval("tinyMCE.activeEditor.selection.getNode()"); 

Как перехватить нажатие кнопки TinyMCE?

У каждой кнопки и бордюра кнопки есть свой className. Его можно получить при нажатии кнопки в поле HTML-документа. Gjckt после этого можно остановить дальнейшее действие при нажатии на кнопку и выполнить свое, например:

Процедура ПолеHTMLДокументаonmousedown(Элемент, pEvtObj)
    className = pEvtObj.srcElement.className;
    Если className = "mceIcon mce_link" 
         Или className = "mceButton mce_link mceButtonEnabled" 
         Или className = "mceButton mceButtonEnabled mce_link mceButtonActive" Тогда

далее останавливаем либо командой:

pEvtObj.returnValue = false;

либо

pEvtObj.CancelBubble = true;

Ну и некоторые настройки для запуска редактора. Прописываются в HTML-файле редактора:

Как растянуть область ввода редактора на все поле HTML-документа?

tinyMCE.init({
…
plugins: "…, fullscreen, …",
…
oninit: function()
               {
                tinyMCE.get('content').execCommand('mceFullScreen');
                }
            });

Как подключить проверку орфографии?

tinyMCE.init({
…
plugins  :  "…, spellchecker, …",
…
spellchecker_languages  :  "+Русский=ru,English=en",
spellchecker_rpc_url  :  "http://speller.yandex.net/services/tinyspell",
spellchecker_word_separator_chars  : '\\s!"#$%&()*+,./:;<=>?@[\]^_{|}\xa7\xa9\xab\xae\xb1\xb6\xb7\xb8\xbb\xbc\xbd\xbe\u00bf\xd7\xf7\xa4\u201d\u201c',
…
});

Как убрать панель статуса в TinyMCE?

tinyMCE.init({
…
theme_advanced_statusbar_location  :  "none",
…
});

Как изменить цвет TinyMCE?

Редактор имеет свой цвет панели и дополнительных окон. Чтобы раскрасить его в цвет формы 1С нужно в файлах редактора:
\tiny_mce\themes\advanced\skins\default\content.css
\tiny_mce\themes\advanced\skins\default\dialog.css
\tiny_mce\themes\advanced\skins\default\ui.css
 найти текст « #F0F0EE» и заменить его своим, например «#EAE5D8».

См. также

Интеграция Альфа Авто 5 / Альфа Авто 6 и AUTOCRM / Инфотек

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

Интеграционный модуль обмена между конфигурацией Альфа Авто 5 и Альфа Авто 6 и порталом AUTOCRM. Данный модуль универсален. Позволяет работать с несколькими обменами AUTOCRM разных брендов в одной информационной базе в ручном и автоматическом режиме. Без существенных изменений типовой конфигурации. Проверено с брендами: Интеграция 1С и GEELY Интеграция 1С и HAVAL Интеграция 1С и KIA Интеграция 1С и FORD Интеграция 1С и LADA ГАРАНТИЯ 100% ВНЕДРЕНИЯ!

36000 руб.

03.08.2020    15726    10    17    

11

Интеграция 1С — Битрикс24. Обмен задачами

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

Интеграция 1С и Битрикс24. Разработка имеет двухстороннюю синхронизацию 1С и Битрикс24 задачами. Решение позволяет создавать пользователя в 1С из Битрикс24 и наоборот. Данная разработка технически подходит под все основные конфигурации линейки продуктов 1С:Предприятие 8.3 (8.3.18.1289). При приобретении предоставляется 1 месяц бесплатных обновлений разработки. Доступна демо-версия продукта с подключением Вашего Битрикс24

5040 руб.

04.05.2021    17541    6    15    

13

Интеграция с сервисом vetmanager

WEB-интеграция Платформа 1С v8.3 Бухгалтерский учет 1С:Бухгалтерия 3.0 Бытовые услуги, сервис Платные (руб)

Внешняя обработка разрабатывалась для загрузки документов из Ветменеджер в 1С: Бухгалтерия 3.0

12000 руб.

02.02.2021    16350    42    49    

23

[Расширение] БОР-Навигатор.Культура

Зарплата Бюджетный учет WEB-интеграция Обмен с ГосИС Платформа 1С v8.3 Сложные периодические расчеты 1С:Зарплата и кадры государственного учреждения 3 Государственные, бюджетные структуры Россия Бюджетный учет Платные (руб)

Расширение конфигурации, включающее в себя объекты, необходимые для подготовки и сдачи отчета "Штатная численность" системы "БОР-Навигатор.Культура" в программе "1С:Зарплата и кадры государственного учреждения", редакция 3.1.

8400 руб.

01.02.2019    25736    9    0    

7

Заполнение по ИНН или наименованию реквизитов контрагента по данным сайта ФНС

Обмен с ГосИС WEB-интеграция Платформа 1С v8.3 Управляемые формы 1С:Комплексная автоматизация 1.х 1С:Бухгалтерия 2.0 1С:Управление торговлей 10 1С:Управление производственным предприятием 1С:Управление нашей фирмой 1.6 1С:Бухгалтерия государственного учреждения 1С:Документооборот 1С:ERP Управление предприятием 2 1С:Бухгалтерия 3.0 1С:Управление торговлей 11 1С:Комплексная автоматизация 2.х Платные (руб)

Обработка является альтернативой механизму, разработанному фирмой 1С и заполняющему реквизиты контрагента по ИНН или наименованию. Не требуется действующей подписки ИТС. Вызывается как внешняя дополнительная обработка, т.е. используется, непосредственно, из карточки контрагента. Заполнение по ИНН или наименованию реквизитов контрагента по данным сайта ФНС (egrul.nalog.ru) для БП 2.0, БП 3.0, БГУ 1.0, БГУ 2.0, УТ 10.3, УТ 11.x, КА 1.1, КА 2.x, УПП 1.x, ERP 2.x, УНФ 1.5, УНФ 1.6, УНФ 3.0, ДО 2.1

2400 руб.

28.04.2016    88569    160    215    

318
Комментарии
В избранное Подписаться на ответы Сортировка: Древо развёрнутое
Свернуть все
1. DanilaDru 262 07.02.11 15:46 Сейчас в теме
Спасибо, прикольные фишки озвучены. В рамках одного проекта начинал тоже с TinyMCE, а потом переполз на форматированный документ в 8.2.
2. Поручик 4670 07.02.11 22:15 Сейчас в теме
Слухи ходят, глюкавый этот ваш форматированный документ в 8.2. Как впрочем и вся эта ваша 8.2.
3. DanilaDru 262 07.02.11 22:58 Сейчас в теме
Спасибо. Для нужд проекта было достаточно.
4. afedorov 118 07.02.11 23:17 Сейчас в теме
TinyMCE тоже не сахар и может глючить. Редактирование этой статьи (редактирование на Инфостарте тоже в TinyMCE) вообще было кошмарным кошмаром.
5. iceflash 4 09.02.11 13:15 Сейчас в теме
"Всё такое "глючное", корявое, и поделочное"=)))))
Шлавное - что бы руки прямые были и голова ясная=)
6. spacedragon 27.09.11 19:02 Сейчас в теме
А существует ли возможность с помощью такого подхода оформлять НТМЛ документ например с CSS и JS вставками? Конкретная ситуация требуется выполнять рассылки е-мейлов с "датчиком" перехода на конкретный сайт, чтобы понимать кто действительно заинтересован в нашей продукции, а кто нет?
7. DanilaDru 262 27.09.11 20:45 Сейчас в теме
(6)Может для рассылок такого рода стоит посмотреть в сторону MailChimp ? Сервис потом статистику дает по отосланной почте. Заодно и почта в спам не так часто попадает (по личным наблюдениям). На вскидку про использование можете посмотреть тут: http://danila.org.ua/?s=mailchimp
8. pvase 401 24.09.12 13:38 Сейчас в теме
Спасибо большое. Нашел непонятный глюк. При вставке текста методом:
JScript = "tinyMCE.activeEditor.execCommand('mceInsertContent',false,'" + СокрЛП(Комент) + "');";
				Браузер.Объект.Document.parentWindow.ExecScript(JScript,"JavaScript");

Если текст является списком:

  • 1
  • 2

Выдает ошибка выполнения сценария в index.html.
Скачал с сайта последний TinyMCE 3.5.7 - не помогает.
10. Поручик 4670 30.10.12 14:13 Сейчас в теме
(8) Смотрите предыдущий пост. Перед вставкой текста кавычки надо заэкранировать, а символы перевода строки перевести в unix-представление.
9. Поручик 4670 30.10.12 13:59 Сейчас в теме
Другой способ вставить HTML в TinyMCE программно. Воспользоваться методом setContent() объекта tinyMCE.activeEditor.

	Если ВвестиСтроку(HTMLКонтент, "Введите строку", , Истина) Тогда

		//Перед передачей строки методу setContent экранируем одинарные и двойные кавычки во избежание ошибки.
		ЭкранированнаяСтрока = СтрЗаменить(СтрЗаменить(СтрЗаменить(HTMLКонтент, """", "\"""), "'", "\'"), Символы.ПС, "\n");
		Элементы.ПолеHTMLДокумента.Документ.parentWindow.eval("tinyMCE.activeEditor.setContent('" + 	ЭкранированнаяСтрока + "');");

	КонецЕсли; 
Boudybuilder; +1 Ответить
14. Boudybuilder 35 23.07.14 23:21 Сейчас в теме
(9) Поручик, супер! Этот способ получше!
11. GanjaGod 11.01.13 01:38 Сейчас в теме
как быть если tinyMCE используется как класс BODY, mceContentBody?
12. MaxiMkaUA 28.02.13 13:29 Сейчас в теме
Для большей уверенности Экранирование написать можно еще так

ЭкранированнаяСтрока = СтрЗаменить(СтрЗаменить(СтрЗаменить(СтрЗаменить(HTMLКонтент, """", "\"""), "'", "\'"), Символы.ПС, "\n"), Символы.ВК, "\n");

13. DefaultUsers 4 23.07.13 11:14 Сейчас в теме
Народ, помогите решить проблему с интеграцией TinyMCE. Еще давным давно внедрил TinyMCE 3 версии в 1С:УТ, теперь решил обновиться до TinyMCE 4. Быстро накидал внешнюю обработку для отладки запуска, и ничего не работает! Уже сломал голову. На форме есть кнопка "Ааа", при нажатии должна открыться хтмл страница с загрузкой TinyMCE, но по каким-то причинам этого не происходит, хотя если открывать эту же страницу в браузере (IE, Chrome) всё работает отлично.
Эксплорер.Перейти(КаталогВременныхФайлов() + "TinyMCE\temp.html");
Прикрепленные файлы:
TinyMCE.epf
15. Boudybuilder 35 24.07.14 02:13 Сейчас в теме
Я тут столкнулся с проблемой. TinyMCE не хочет отображаться на управляемых формах на веб или на тонкомклиенте на другом компьютере в сети. Работает только на тонком клиенте на локальном компе. Вот как реализован ее вывод в полеHTMLдокумента на управляемой форме.

ВремФайл = ЭтаФорма.КаталогДанных + "temp.html";
    Т.Записать(ВремФайл, КодировкаТекста.ANSI);
    Эксплорер = ВремФайл;


А текст этого самого ВремФайл вот такой:

<HTML><HEAD><meta http-equiv="Content-Type" content="text/html; charset=windows-1251" content="no-cache">
<script type="text/javascript" src="tinymce/tinymce/jscripts/tiny_mce/tiny_mce.js"></script>
<!-- TinyMCE -->
<script type="text/javascript">
  tinyMCE.init({
    // General options
    mode : "textareas",
    theme : "advanced",
    plugins : "safari,pagebreak,style,layer,table,save,advhr,advimage,advlink,emotions,iespell,inlinepopups,insertdatetime,preview,media,searchreplace,print,contextmenu,paste,directionality,fullscreen,noneditable,visualchars,nonbreaking,xhtmlxtras,template",
    entity_encoding : "raw",

    // Theme options
    theme_advanced_buttons1 : "save,newdocument,|,bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull,styleselect,formatselect,fontselect,fontsizeselect",
    theme_advanced_buttons2 : "cut,copy,paste,pastetext,pasteword,|,search,replace,|,bullist,numlist,|,outdent,indent,blockquote,|,undo,redo,|,link,unlink,anchor,image,cleanup,help,code,|,insertdate,inserttime,preview,|,forecolor,backcolor",
    theme_advanced_buttons3 : "tablecontrols,|,hr,removeformat,visualaid,|,sub,sup,|,charmap,emotions,iespell,media,advhr,|,print,|,ltr,rtl,|,fullscreen",
    theme_advanced_buttons4 : "insertlayer,moveforward,movebackward,absolute,|,styleprops,|,cite,abbr,acronym,del,ins,attribs,|,visualchars,nonbreaking,template,pagebreak",
    theme_advanced_toolbar_location : "top",
    theme_advanced_toolbar_align : "left",
    theme_advanced_statusbar_location : "bottom",
    theme_advanced_resizing : true,

    // Example content CSS (should be your site CSS)
    content_css : "[CSS]",

    // Drop lists for link/image/media/template dialogs
    template_external_list_url : "lists/template_list.js",
    external_link_list_url : "lists/link_list.js",
    external_image_list_url : "lists/image_list.js",
    media_external_list_url : "lists/media_list.js",

    // Replace values for the template plugin
    template_replace_values : {
      username : "Some User",
      staffid : "991234"
    }
  });
</script>
<!-- /TinyMCE -->
</HEAD><BODY>
<form method="" action="" onsubmit="return false;">
<textarea id="elm1" name="elm1" style="width: 100%;height:100%">

</textarea>
<script type="text/javascript">tinyMCE.init({ ... });</script></BODY></HTML>
Показать


В таком варианте работает только на локальной машине на ТонкомКлиенте. Как реализовать чтобы скрипты подхатывались и на веб или на другой машине на ТК в сети?
16. Shkalar 10.08.14 21:26 Сейчас в теме
(15) Boudybuilder, (13) DefaultUsers, IE блокирует скрипты на локальных файлах, поэтому нужно либо страницу с веб сервера запускать, либо попробуйте добавить в начало страницы
<!do ctype html>
<!-- saved from url=(0014)about:internet -->




msdn.microsoft.com

P.S. doctype в одно слово, т.к. редактор сам переформатировал с пробелом
ivanov660; +1 Ответить
17. 2tvad 70 06.11.18 15:36 Сейчас в теме
06.11.2018 что то случилось с IE (вышли к-то обновления) и вызов Tiny, как локального файла перестал работать. Печаль.
18. user1216702 30.07.21 16:18 Сейчас в теме
В управляемых формах редактор tinyMCE по нажатию правой кнопкой мыши помимо контекстного меню редактора открывает меню платформы 1С. Кому удалось решить эту проблему?
Прикрепленные файлы:
19. aupovy 50 29.12.22 15:33 Сейчас в теме
(18) Тоже такое возникает и непонятно как проходит, само решается. Версия 4.2.4
20. DERL 08.01.24 11:50 Сейчас в теме
последняя 6.8.2 версия tinyMCE не взлетела на 8.3.23, а 5.10.9 без проблем
так и не понял в чем проблема
Оставьте свое сообщение