12.05.2018

Использование CodeMirror в ASP.NET WebForms приложениях

Несколько лет назад разрабатывал систему на ASP.NET WebForms, в которой расчет ряда значений задавался с помощью формул, формулы описывались языком javascript. Было решено для обработки формул использовать Jurassic, а в качестве визуального редактора использовать CodeMirror. CodeMirror - это классный текстовой редактор, написанный на javascript, для использования на веб-страницах с возможностью расширения. Данный редактор поддерживает возможность подсветки синтаксиса более чем 100 языков программирования.
В целом процесс внедрения CodeMirror в нашу систему проходил успешно, но возникла проблема при использовании его внутри UpdatePanel. Для решения данной задачи был использован следующий хак:
function initializeCodeMirror() {
 var formulaTxt = '<%=FormulaTxt.ClientID%>';
  
 var editor = CodeMirror.fromTextArea(document.getElementById(formulaTxt), {
         leaveSubmitMethodAlone: true,
         lineNumbers: true,
         mode: "javascript",
         theme: 'neat',
         continuousScanning: 500,
         matchBrackets: true,
         continueComments: "Enter",
         extraKeys: {
             "F11": function(cm) {
               cm.setOption("fullScreen", !cm.getOption("fullScreen"));
             },
             "Esc": function(cm) {
               if (cm.getOption("fullScreen")) cm.setOption("fullScreen", false);
             },
             "Ctrl-Q": "toggleComment"
         }
});
  
// Хак для использования CodeMirror в UpdatePanel
window['cmLocalStateEvent'] = function () { editor.save(); };
     
// Хак для отображения контента CodeMirror с учетом интерферирующих скриптов
setTimeout(function() {
 editor.refresh();
}, 0);

Комментариев нет:

Отправить комментарий