Editor HTML em Formulário (richEditor)

TOTVS Fluig Documentos (ECM)
, , ,
1

Estou tentando utilizar o componente RichEditor em um formulário no Fluig 1.6.2. Insiro o componente conforme instruções em style.fluig (https://style.fluig.com/miscellaneous.html#rich-editor), mas o componente não funciona quando abro o formulário. Verificando o console, não está conseguindo localizar o arquivo .css e o .js, conforme erros abaixo:

fluig-style-guide-richeditor.min.css Failed to load resource: the server responded with a status of 404 (Not Found) fluig-style-guide-richeditor.min.js Failed to load resource: the server responded with a status of 404 (Not Found) custom.js:13 Uncaught TypeError: FLUIGC.richeditor is not a function at custom.js:13 fluig-style-guide-richeditor.min.css Failed to load resource: the server responded with a status of 404 (Not Found)

Verifiquei que os arquivos /portal/resources/css/fluig-style-guide-richeditor.min.css e /portal/resources/js/fluig-style-guide-richeditor.min.js chamados para o componente não existem na versão 1.6.2 nem na 1.6.3.

Alguém possui esses arquivos para disponibilizar?

Analisando a tela de edição de página do Fluig, quando vamos inserir um widget do tipo Editor de Conteúdo em um slot, ele utiliza exatamente esse componente richEditor, só que em uma SuperWidget, ou seja, em algum lugar tem as funções js e css para utilização.

Desde já agradeço a ajuda.

2

Recomendo que abra um chamado para a equipe de portais, pois testei por aqui e a situação de fato não esta acontecendo como deveria.

3

Sim Peter, eu já abri o chamado e estou aguardando o retorno. Obrigado.

4

Consegui localizar o problema: O manual não está correto. O caminho correto é: src="/portal/resources/style-guide/js/fluig-style-guide-richeditor.min.js" * estava faltando o diretorio style-guide no link, e o arquivo .css não é necessário. Com isso passou a funcionar corretamente.

5

@Gilson Lima boa tarde, Sabe me dizer como retornar um valor desse campo editor em um evento, por exemplo o ValidateForm?

6

Para acessar os dados do editor eu faço:
var html = editor.getData();
html = /<body.?>([\s\S])</body>/.exec(html)[1];

Isso vai pegar apenas o conteúdo existente dentro da tag body do iframe do richeditor.

7

Consegui fazer graças ao @Gilson Lima , a documentação no Style Guide está errada.

O caminho correto é: src="/portal/resources/style-guide/js/fluig-style-guide-richeditor.min.js

8

Acredito que devem ter corrigido, pois na versão Silver Mist - 1.8.1, basta importar com a versão da documentação, que funciona.


<script src="/style-guide/js/fluig-style-guide-codeeditor.min.js"></script>

Eu estava com dificuldade para salvar o valor e consegui assim:


var conteudo_mensagem =  $('#conteudo_mensagem').val();
    if(conteudo_mensagem){
        editor.setValue(conteudo_mensagem);
    }

    editor.on('change', function(){
        $('#conteudo_mensagem').val(editor.getValue());
    });