![](/img/trans.png)
[英]JSF Primefaces Bean: How to delete selected value from SelectOneListBox?
[英]JSF PrimeFaces - Save value of selected tablecell on buttonclick
先决条件:
故事:
我有一个显示一些可编辑值的数据表。 列数是动态的。 在同一个表单中是一个按钮,调用我的bean的保存操作来保存所有编辑的数据。 它自己的功能非常好
执行:
<p:dataTable id="dataTable" scrollable="true"
widgetVar="wigVardataTable"
value="#{myBean.dataList}"
var="data"
editable="true"
editMode="cell"
rowKey="rowkey">
<p:columns var="col"
value="#{myModel.columnList}"
style="font-size: 12px">
<f:facet name="header">
<h:outputText
value="#{col.header}" />
</f:facet>
<p:cellEditor>
<f:facet name="output">
<h:outputText
value="#{myModel.getValueForTableCell(data, col).value}" />
</f:facet>
<f:facet name="input">
<p:inputText
id="inputTxt"
value="#{myModel.getValueForTableCell(data, col).value}"
style="width:100%">
</p:inputText>
</f:facet>
</p:cellEditor>
</p:columns>
</p:dataTable>
问题:
当正在编辑表格单元格时按下保存按钮并且还没有失去焦点时,表格单元格的inputtext中的新值将不会被写回到我的bean中,因此不会保存。
题:
在执行按钮操作之前,如何将数据写回我的支持bean?
此行为是由ajax事件的错误排序引起的。 在打开单元格编辑器的同时调用命令按钮时,在单元格编辑的ajax事件之前触发命令按钮的ajax事件。
因此,我们想要交换它们。 在不编辑PrimeFaces源代码的情况下,您可以通过在打开单元格编辑器时显式调用<p:dataTable>
小部件的saveCell()
函数来实现此saveCell()
。
所以,给出一个
<h:form>
<p:dataTable ... widgetVar="wigVardataTable" />
<p:commandButton ... />
</h:form>
您可以通过将以下onclick
添加到<p:commandButton>
来实现所需的行为:
onclick="var d=PF('wigVardataTable'), c=d.jq.find('td:has(.ui-cell-editor-input:visible)'); if(c.length)d.saveCell(c)"
基本上,它首先使用开放单元格编辑器查找单元格,然后在其上调用saveCell()
。
另一种不太优雅的方法是显式调用<p:dataTable>
小部件的showCellEditor()
函数,而不在try-catch
块中传递预期的目标单元格,忽略异常。
onclick="try{PF('wigVardataTable').showCellEditor()}catch(ignore){}"
它将首先保存任何打开的单元格,然后抛出一个错误,指出没有新的目标单元格被指定为参数,但可以忽略它,如上所示。
值得注意的是,无论您使用<p:columns>
还是<p:column>
,还是使用普通模型还是过于复杂的模型,这一切都能正常运行;)这个技巧在PrimeFaces 5.2版本上进行了测试和目前的PrimeFaces 6.0版本。
这是一个受BalusC答案启发的通用解决方案,如果你有其他数据表与单元格editMode:
<script type="application/javascript">
function saveAllCellsBeforeSubmit() {
for (var widgetName in PrimeFaces.widgets) {
if (PrimeFaces.widgets[widgetName].hasOwnProperty('cfg') && PrimeFaces.widgets[widgetName].cfg.hasOwnProperty('editMode') && PrimeFaces.widgets[widgetName].cfg.editMode === 'cell') {
var d = PF(widgetName);
var c = d.jq.find('td:has(.ui-cell-editor-input:visible)');
if (c.length) {
d.saveCell(c);
}
}
}
}
</script>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.