vaadin textArea fraola editor - PullRequest
Новая
       39

vaadin textArea fraola editor

0 голосов
/ 09 июня 2018

Я пытаюсь использовать редактор fraola в vaadin.Редактор Fraola - это JavaScript-компонент richText, позволяющий легко копировать изображение из буфера обмена.В vaadin я просто вставляю vaaadin textArea Widget и вызываю функцию javascript $ ("# richtext"). FraolaEditor () ... На стороне клиента это работает отлично, но на стороне сервера textArea остается пустым.Я попытался заполнить textArea с помощью javascript: на клиенте textAreain был заполнен, но оставался пустым на стороне сервера .... любая помощь приветствуется

код: vl.addComponent (getRtarea ()); 

    String fraola = "var liste = ''; " 
            + "         $(function() {"
            + "         $('#richText').froalaEditor({"
            + "         enter:$.FroalaEditor.ENTER_P," 
            + "         toolbarButtons:['insertFile','insertImage', 'fullscreen', '|', 'undo', 'redo' , '|', 'fontFamily', 'fontSize', 'color', 'bold', 'italic', 'underline', 'strikeThrough', 'subscript', 'superscript', 'outdent', 'indent', 'clearFormatting', 'insertTable', 'html'],"
            + "         fileUploadURL: 'uploadFile'," 
            + "         imageUploadURL: 'uploadFile',"
            + "         pastedImagesUploadURL: 'uploadFile',  " 
            + "         language: 'fr'"
            + "         }).on('froalaEditor.blur', function(){"
            + "             $('#richText').val($('.fr-element').text()).focus();"
            + "             alert($('#richText').val());"
            + "         })"
            + "         ;});";

    Page.getCurrent().getJavaScript().execute(fraola);

и getRtarea (): 

public TextArea getRtarea() {
if (_rtarea == null) {
    this._rtarea = new TextArea();
    _rtarea.setId("richText");
    _rtarea.setSizeFull();
}
return _rtarea;
}

Ответы [ 2 ]

0 голосов
/ 11 июня 2018

Проблема здесь, скорее всего, заключается в том, что виджет TextArea только прослушивает события изменения значения, созданные пользователем, но не реагирует, если его значение изменяется из JavaScript.

Вместо этого можно использовать одиниз доступных механизмов RPC для отправки нового значения непосредственно на сервер вместо его передачи через существующий компонент.Для автономной интеграции вы можете использовать механизм, описанный в https://vaadin.com/docs/v8/framework/articles/ExposingServerSideAPIToJavaScript.html. В качестве альтернативы, вы можете создать обычный компонент JavaScript на основе https://vaadin.com/docs/v8/framework/articles/IntegratingAJavaScriptComponent.html и https://vaadin.com/docs/v8/framework/articles/UsingRPCFromJavaScript.html.

0 голосов
/ 09 июня 2018

Метод, который вы пытаетесь использовать, не является предпочтительным для интеграции компонентов JavaScript в Vaadin.Строка fraola, будет отправляться каждый раз, когда вы вызываете execute (fraola), это создаст лишние издержки, когда это делается часто.В вашем случае вам также нужно указать объект.Подробнее о создании компонента JavaScript читайте здесь:

https://vaadin.com/docs/v8/framework/articles/IntegratingAJavaScriptComponent.html

...