我正在基于CodeMirror文本编辑器创建一个JSF复合组件,它是'merge' addon。现在我的组件按预期显示(基本编辑器加上另一个要与之比较的CodeMirror实例)。
我的代码:
<cc:interface>
<!-- attributes -->
...
</cc:interface>
<cc:implementation>
<h:outputStylesheet library="..." name="..." />
...
<h:outputScript library="..." name="..." />
...
<div id="#{cc.clientId}">
<h:panelGroup id="pgContent" styleClass="#{cc.attrs.styleClass}" style="#{cc.attrs.style}" rendered="#{cc.attrs.rendered}">
<h:inputHidden id="#{cc.clientId}_inputHiddenMain" value="#{cc.attrs.value}" immediate="true">
<c:if test="#{not empty cc.attrs.converter}">
<f:converter converterId="#{cc.attrs.converter}" />
</c:if>
</h:inputHidden>
<h:inputHidden id="#{cc.clientId}_inputHiddenLeft" value="#{cc.attrs.origLeft}" immediate="true" rendered="#{cc.attrs.origLeft ne null}">
<c:if test="#{not empty cc.attrs.converter}">
<f:converter converterId="#{cc.attrs.converter}" />
</c:if>
</h:inputHidden>
<h:inputHidden id="#{cc.clientId}_inputHiddenRight" value="#{cc.attrs.origRight}" immediate="true" rendered="#{cc.attrs.origRight ne null}">
<c:if test="#{not empty cc.attrs.converter}">
<f:converter converterId="#{cc.attrs.converter}" />
</c:if>
</h:inputHidden>
</h:panelGroup>
</div>
<script type="text/javascript">
/* <![CDATA[ */
if(#{cc.attrs.rendered}){
if (!com) {
var com = {};
}
if (!com.example) {
com = {
example: {}
};
}
if (!com.example.faces) {
com.example = {
faces: {}
};
}
if (!com.example.faces.codemirrormerge) {
com.example.faces.codemirrormerge = {
init: function(id, clientId, styleClass, ...) {
var cmmInput = $("[id='" + clientId + ":" + id + "_inputHiddenMain']"),
cmmOrigLeft = $("[id='" + clientId + ":" + id + "_inputHiddenLeft']"),
cmmOrigRight = $("[id='" + clientId + ":" + id + "_inputHiddenRight']"),
target = $('.' + styleClass),
options = {
value: cmmInput.val(),
revertButtons : revertButtons,
showDifferences : showDifferences,
connect : connect,
collapseIdentical : collapseIdentical,
mode: mode,
theme: theme,
autoRefresh: true,
...
},
myCodeMirrorMerge = CodeMirror.MergeView(target[0], options),
myCodeMirror = myCodeMirrorMerge.editor();
myCodeMirror.on("blur", function() {
$("[id='" + clientId + ":" + id + "_inputHiddenMain']").val(myCodeMirror.getValue());
});
}
}
}
// init component
com.example.faces.codemirrormerge.init('#{cc.attrs.id}', '#{cc.clientId}', '#{cc.attrs.styleClass}', ...);
}
/* ]]> */
</script>
</cc:implementation>
我使用了三个inputHidden
组件来保存编辑器值和两个要比较的值。当“模糊”事件发生时,编辑器中所做的更改将复制回inputHidden
组件。到现在为止还挺好。但是当我使用这样的组件时:
<myns:codeMirrorMerge id="inputContent" styleClass="myStyleClass" origLeft="#{bean.origLeft}" origRight="#{bean.origRight}" value="#{bean.content}" converter="escapeConverter" mode="text/x-plsql" theme="eclipse"
matchBrackets="true" closeBrackets="true" activeLine="true" autocompleteSql="true" lineWrapping="true" />
<p:commandButton id="btnSave" value="Save" action="#{bean.saveContent}" />
,带有编辑器内容的inputHidden
值应该在辅助bean中提交,但事实并非如此。我还尝试使用process="@(.myStyleClass)"
来显式处理整个组件,但没有运气。
所以我的问题是:为什么inputHidden
值没有在辅助bean中提交?
谢谢!