Проблема с настройкой HTML-редактора Ajax Control Toolkit?

Как изменить настройку по умолчанию для HTML-редактора ACT? Я хочу загрузить редактор, например, с помощью выделенной полужирной кнопки или с направлением rtl вместо ltr по умолчанию.
Как я могу это сделать? Я переопределил метод FillTopToolbar() для добавления пользовательских кнопок, но не знаю, как изменить настройки по умолчанию.
поскольку выбрано значение по умолчанию ltr, я хочу изменить его на rtl.


text-editor c# asp.net html-editor ajaxcontroltoolkit
person Mehdi    schedule 13.01.2010    source источник

Ответы (2)


arrow_upward
5
arrow_downward

Я отредактировал свой ответ, чтобы исправить некоторые ошибки

HTMLEditor не позволяет установить состояние этих кнопок с помощью серверного кода. Хотя на клиенте он инициализируется с помощью события Sys.Application.load. Если вы запустили свой код после их инициализаторов, но до того, как пользователь будет взаимодействовать с пользовательским интерфейсом, вы можете установить любые свойства, которые хотите установить в этом обработчике событий.

Вот код, который вам нужен, чтобы установить полужирную кнопку и состояния кнопок rtl. Вы можете взять его отсюда, если хотите изменить состояния других кнопок:

// Attach a handler to the load event.
Sys.Application.add_load(myOnLoadLoader);

function myOnLoadLoader() {
    //This will run JUST after ALL code that was set to run during the load event has run
    window.setTimeout(myOnLoad, 0);
}

function myOnLoad() {
    var editor = $find('<% =editor.ClientID %>');
    var toolbar = editor.get_changingToolbar();
    var toolbarButtons = toolbar.get_buttons();
    for (var i = 0; i < toolbarButtons.length; i++) {
        var toolbarButton = toolbarButtons[i];
        if (toolbarButton instanceof AjaxControlToolkit.HTMLEditor.ToolbarButton.Rtl ||
        toolbarButton instanceof AjaxControlToolkit.HTMLEditor.ToolbarButton.Bold) {
            toolbarButton.set_activeEditPanel(editor.get_editPanel());
            toolbarButton.callMethod();
        }
    }
}

Sys (и, следовательно, Sys.Application) — это пространство имен, полученное из javascript ASP.Net AJAX (файлы, которые добавляются благодаря ScriptManager, который вы добавляете на свою страницу). Если вы используете это, вы должны быть уверены, что эта строка Sys.Application.add_load(myOnLoad); запускается после загрузки файлов ASP.Net AJAX. Вы можете сделать это несколькими способами:

  1. Добавьте этот скрипт ниже на странице, чем scriptManager.
  2. Переместите свой скрипт в отдельный файл JS и используйте ScriptManager для его загрузки (рекомендуется).

Если вы переместите свой сценарий в отдельный файл, вы заметите, что var editor = $find('<% =youreditor.ClientID %>'); больше не работает. Это связано с тем, что файлы javascript не анализируют теги сервера и не заменяют их значением на стороне сервера (как это делают страницы aspx). Итак, проблема здесь в <% =youreditor.ClientID %>.

Чтобы исправить это, вот что вы делаете:

Добавьте это в свою разметку aspx (в разделе заголовка):

<script language="javascript">
    var myEditorId = '<%= youreditor.ClientID %>';
</script>

Так это выглядит примерно так:

<head runat="server">
    <script language="javascript">
        var myEditorId = '<%= youreditor.ClientID %>';
    </script>
<title></title>
</head>

(Если вы используете мастер-страницу, вы просто добавите тег скрипта под ScriptManager на своей странице)

И в вашем JS-файле замените это

var editor = $find('<% =youreditor.ClientID %>');

с этим

var editor = $find(myEditorId);
person Gabriel McAdams    schedule 19.01.2010
comment
Это огромное излишество для вопроса ... все, что вам нужно сделать, это установить существующее свойство таблицы стилей и поместить туда стили по умолчанию, которые вы хотите. Кнопки уже сами обновляются... - person Nick Craver; 19.01.2010
comment
@Ник: ты ошибаешься. ОП не спрашивал, как сделать так, чтобы элемент на странице читался справа налево. Он спросил, как установить свойства компонента HTMLEditor. - person Gabriel McAdams; 19.01.2010
comment
@Gabrial McAdams: после вашего редактирования ответ стал гораздо более подходящим, это были другие изменения, которые сделали его излишним. Я удалил свой ответ на это, потому что функция автоматического обнаружения отсутствует в наборе инструментов Ajax по умолчанию, похоже, она была удалена незадолго до последней версии. Ваш текущий ответ сейчас точен, если они добавят функциональность для определения состояния обратно в выпуск 4.0, я вернусь и обновлю этот вопрос. - person Nick Craver; 19.01.2010
comment
Привет, мистер МакАдамс, и спасибо за подробный ответ. Я думаю, что ваш ответ идеален, но есть проблема, и эта проблема - мои плохие знания о библиотеке Asp.net AJAX. Я очень новичок. Я поместил ваш код в тег ‹script› на странице, размещенной моим редактором, и отладчик не распознает объект Sys.Application. Я повторил это в исходном коде веб-сайта Ajax Control Toolkit в папке редактора HTML, и результат был таким же. Какой исходный файл сценария Java я должен добавить в свой проект, которого нет на примере веб-сайта ACT!? Пожалуйста, узнайте меня об использовании вашего кода. Спасибо. - person Mehdi; 20.01.2010
comment
Sys.Application должен быть там. Это может быть проблема с порядком загрузки скрипта. Поместите ваш скрипт в отдельный файл js, добавьте ваш файл скрипта в менеджер скриптов, чтобы он загружался в правильном порядке. - person Gabriel McAdams; 20.01.2010
comment
@Gabriel McAdams: Я пытался в соответствии с вашим руководством. но $find(‹% =editor1.ClientID %›); возвращает ноль. Я загрузил свою страницу и js-файл здесь:сайты .google.com/site/mahdiahmadirad/download-1/ . Пожалуйста, если у вас есть достаточно времени, чтобы потратить на меня! загрузите его и скажите мне, что не так с моим кодом? эти файлы - все, что у меня есть в моем проекте о ajax control liberary. если вы хотите отправить мне файл, пожалуйста: mahdi-ahmadi-rad AT gmail DOT com (без тире). большое спасибо. - person Mehdi; 21.01.2010
comment
Прости. Как только вы переместите свой javascript во внешний файл, тег сервера не будет работать. Вы должны заменить его идентификатором, сгенерированным asp.net. Я добавил это в свой ответ, если вы хотите увидеть, как это делается. - person Gabriel McAdams; 22.01.2010
comment
Спасибо. Я сделал то, что вы сказали, но теперь возникла другая проблема с var myEditorId = '‹%= youreditor.ClientID %›'; возникает ошибка: сообщение: Коллекция Controls не может быть изменена, так как элемент управления содержит блоки кода (т. е. ‹% ... %›). Я заменил ‹%= на ‹%#, и ошибка была исправлена, но теперь в переменной myEditorId ничего нет, и ее содержимое:. вот вопрос: есть ли разница между ID=editor1 и id=editor1 в качестве идентификатора редактора ACT в этой ситуации? - person Mehdi; 22.01.2010
comment
Как вы добавляете этот тег скрипта на страницу? Смотрите мой измененный ответ для хорошего примера. - person Gabriel McAdams; 22.01.2010
comment
Я исправил это, поместив тег сценария внутри тега формы (потому что тег сценария для страницы внутри тега заголовка будет помещен в MaterPage!). но есть еще одна проблема с вашим кодом JScript. Метод toolbarChanging не содержит кнопки для извлечения. Я помещаю скриншот здесь: tinyurl.com/acttrace Итак, For Loop не зацикливается, и если условия не Работа! var myEditorId = '‹%= youreditor.ClientID %›'; работает правильно. - person Mehdi; 22.01.2010
comment
Я не уверен, почему коллекция кнопок равна нулю. Я буду смотреть в него. Один из вариантов, однако, состоит в том, чтобы взять кешированные идентификаторы кнопок и разделить их на ';' и для каждого вызывайте $find(). Это также даст вам кнопки. - person Gabriel McAdams; 22.01.2010
comment
Извините за беспокойство, Габриэль. Я изменил код, как вы говорите: var toolbarButtons = toolbar._cachedButtonIds.split(';'); Итак, теперь у меня есть все идентификаторы кнопок в toolbarButtons, но это идентификаторы, а не точные кнопки, и условия if внутри foreach никогда не будут истинными для вызова методов! Можете ли вы помочь мне с этим? - person Mehdi; 22.01.2010
comment
для каждого идентификатора вызовите эту функцию, чтобы получить объект кнопки — var button = $find(thebuttonid); - person Gabriel McAdams; 22.01.2010
comment
Я сделал это после множества исправлений! Я добрался до RTL и Bold Button и button.callMethod(); вызывается метод. но, к сожалению, никаких изменений в редакторе не произошло. что делает callMethod()? - person Mehdi; 22.01.2010
comment
Я посмотрел на это, и у меня были некоторые неправильные вещи. На момент запуска моего скрипта кнопки еще не были инициализированы. Если он запускается позже (после загрузки страницы), то он работает. Я постараюсь заставить его работать раньше. - person Gabriel McAdams; 22.01.2010
comment
После прочтения кода javascript для HTMLEditor кажется, что, хотя редактор создается во время инициализации, он, а также панель инструментов и кнопки панели инструментов инициализируются во время загрузки. Это означает, что ваш код ДОЛЖЕН выполняться после события загрузки, но до того, как страница станет пригодной для использования. Кроме того, я заметил, что на этом этапе активная панель редактирования кнопок также должна быть установлена ​​вручную (она устанавливается позже, так что в этом нет ничего плохого). Я изменил свой ответ соответственно. Код в моем измененном ответе был протестирован и работает. - person Gabriel McAdams; 23.01.2010
comment
@ Габриэль МакАдамс: Очень, очень, очень, очень большое спасибо за ваше время! Проблема решена правильно в соответствии с вашими терпеливыми ответами. Извините, если я причинил вам боль своими тревожными вопросами. Я узнал много нового о клиентской стороне от вас. в любом случае, спасибо. - person Mehdi; 23.01.2010
comment
Не беспокойтесь об этом. Я был рад помочь. Я рад, что у тебя все заработало. - person Gabriel McAdams; 23.01.2010
comment
Я писал об этом в своем блоге. Думал, что другим разработчикам будет легче пройти. thecodepage.com/ пост/ - person Gabriel McAdams; 10.02.2010

arrow_upward
0
arrow_downward

Вам нужно будет сделать это с помощью CSS, поскольку элемент управления редактором изначально не поддерживает rtl. Следующий CSS установит направление на rtl —

div
{
    direction:rtl;
}

Стили по умолчанию для редактора HTML можно найти в файле Editor.css.

person Craig Schwarze    schedule 16.01.2010
comment
моя веб-страница Hole - rtl. но это не влияет на редактор ACT, поскольку он зависит от стиля страницы. Я хочу установить кнопку направления на RTL по умолчанию. - person Mehdi; 16.01.2010
comment
Вы можете найти стиль CSS по умолчанию в AjaxControlToolkit\HTMLEditor\Editor.css. HTMLEditor также имеет свойство CssClass. - person Craig Schwarze; 16.01.2010
comment
Не могли бы вы указать мне имя класса ведьмы, если я изменю? есть много имен классов, и я не могу найти, что одно из них предназначено для стиля текстовой области, чтобы изменить стиль на RTL. хотя я не думаю, что это решение приводит к тому, что выбранная кнопка rtl отображается на панели инструментов управления. - person Mehdi; 17.01.2010