2

我以这种方式将 Summernote 与 JSF 一起使用：

<div class="form-group">
                <label>Texto</label>
                <h:inputTextarea value="#{cursoMB.questao.questao.texto}"
                    disabled="#{cursoMB.questao == null}"
                    styleClass="summernote form-control" />
            </div>

我的 JavaScript：

jQuery('.summernote').summernote({
     height: 300,                 // set editor height

      minHeight: null,             // set minimum height of editor
      maxHeight: null,             // set maximum height of editor

      focus: false                 // set focus to editable area after initializing summernote      
});

一切正常，但是当我执行以下操作时commandLink，summernote 消失在一个简单的inputTextArea没有设计的转换中：

<h:commandLink actionListener="#{cursoMB.inserirQuestao()}"
                styleClass="btn btn-default" title="clique para inserir a questão">
                <f:ajax execute="@this" render="divTeste divQuestao"
                    onevent="function(data) { if (data.status === 'success') { 
    document.getElementById('inputTextOrdemQuestao').focus() } }" />
                <i class="fa fa-plus fa-fw"></i>
            </h:commandLink>

我注意到发生这种情况是因为 ajax 再次呈现我的页面。我怎样才能解决这个问题？

4

1 回答 1

2

导致此问题的原因是 JavaScript 操作的 HTML 片段被原始服务器生成的 HTML 替换，之后没有再次进行 JS 操作。

你基本上有两个选择：

  1. 简单地不要对 JS 操作的 HTML 片段进行 ajax 更新。只需显式地仅更新真正需要更新的部分，例如仅<h:message>与输入字段关联的组件。

  2. 或者，如果这不是一个选项，例如因为您需要重新显示提交的值，因为您正在使用一些操作提交的值的转换器，那么当那段 HTML 是 ajax 时，您需要显式地重新执行该 JS 操作-更新。在您的具体情况下，归结为在活动jQuery('.summernote').summernote(...)期间再次致电success。

也可以看看：

于 2015-03-02T07:00:37.660 回答