0
JSFおよびPrimefacesベースのJavaアプリケーションでは、ユーザーがコメントを追加するために動的に行を追加できるテーブルがあります。Primefacesデータテーブル内の行がまだ編集中かどうかを確認するBeanのメソッド
コメントのある表のコードです。コメントを追加するには、ボタンを押します。ボタンを押すと、表の上部にコメントが追加されます。 新しい行に入力されたテキストを保存するために、チェックアイコンを押した場合はすべて正常に機能します。ただし、ページ全体（コードは含まれません）を保存すると、作成者フィールドと日付フィールドのみが保存されます。入力されたテキストはすべて失われます。
私は、Primefacesデータテーブルの行がまだ編集されているかどうかを調べるために、それを保存するか、ユーザーに警告を表示するかを見つけようとしています。
これはXHTMLです：
<div class="ui-g-6 no-vertical-padding">
<f:event type="preRenderView" listener="#{commentController.initPage()}"/>
<h:form id="CommentsForm">
<p:commandButton style="width: 1px; height: 1px; position: fixed; top: -1000px;"
action="#{mainController.save}" styleClass="cleanDirtyButton"/>
<p:fieldset legend="Comments" style="height: 309px">
<p:remoteCommand name="onCellEdit" update="commentTable" partialSubmit="true"
ignoreAutoUpdate="true"/>
<!--<h:inputHidden id="hiddenSizeId" value="#{commentForm.itemsSize}"/>-->
<!--<h:inputHidden id="hiddenIxId" value="#{commentForm.newItemIx}"/>-->
<!-- workarround -->
<h:inputHidden id="hiddenSizeId" value="1000000"/>
<h:inputHidden id="hiddenIxId" value="999999"/>
<script type="text/JavaScript">
function getNewItemPos() {
var noOfItems = $("#CommentsForm\\:hiddenSizeId").val();
var itemIx = $("#CommentsForm\\:hiddenIxId").val();
var bucketHt = $("#CommentsForm\\:commentTable .ui-datatable-scrollable-body").height();
var scrollHt = $("#CommentsForm\\:commentTable .ui-datatable-scrollable-body").prop("scrollHeight");
var itemHt = parseInt(scrollHt)/parseInt(noOfItems);
var noItemsInBucket = parseInt(bucketHt)/parseFloat(itemHt);
var itemNo = parseInt(itemIx) + 1;
var targetBucket = parseInt(itemNo)/parseFloat(noItemsInBucket);
var halfBucketHt = parseInt(bucketHt)/2;
var scrollPos =
(parseInt(bucketHt) * (parseFloat(targetBucket) - 1)) + parseFloat(halfBucketHt);
var scrollPosInt = Math.round(parseFloat(scrollPos));
$('#CommentsForm\\:commentTable .ui-datatable-scrollable-body').animate({scrollTop: scrollPosInt});
}
function setCellFocus() {
$('.focus_comment:visible').delay().focus();
}
function cellEdit() {
setTimeout(setCellFocus, 1500);
$('.editTable .ui-datatable-data tr').last().find('span.ui-icon-pencil').each(function() {
jQuery(this).click()
});
}
</script>
<p:dataTable id="commentTable"
widgetVar="commentTableWidget"
value="#{projectForm.project.Comments}"
sortOrder="DESCENDING"
sortBy="#{comment.changedOn}"
var="comment"
editable="true"
rowIndexVar="rowIndex"
resizableColumns="true"
scrollable="true"
scrollRows="10"
liveScroll="true"
scrollHeight="212"
style="margin-top: 5px;"
emptyMessage="No comment found"
styleClass="ui-corner-all plus-button editTable noBackground">
<f:facet name="footer">
<p:commandButton id="addlink"
action="#{commentController.addComment()}"
oncomplete="getNewItemPos();cellEdit();setCellFocus();"
disabled="#{commentForm.editMode or !pR.hasPermission('PROJECTS:write')}"
process="@this"
partialSubmit="true"
update="commentTable"
value="Add Comment"
styleClass="table-plus-button"
icon="fa fa-plus" iconPos="right">
<p:ajax update=":CommentsForm:commentTable :CommentsForm:hiddenIxId :CommentsForm:hiddenSizeId"/>
</p:commandButton>
</f:facet>
<p:ajax event="rowEdit" listener="#{commentController.onRowEdit}"
update="commentTable"
oncomplete="if (args && !args.validationFailed) {onCellEdit();} else {$('.editTable tbody.ui-datatable-data tr td .deleteButton').hide();}"/>
<p:ajax event="rowEditCancel" listener="#{commentController.onRowCancel}"
onsuccess="onCellEdit();" update="commentTable"/>
<p:ajax event="rowEditInit" listener="#{commentForm.setEditMode(true)}"
update="addlink"
onstart="$('.editTable tbody.ui-datatable-data tr td .ui-icon-pencil').hide();$('.editTable tbody.ui-datatable-data tr td .deleteButton').hide();"/>
<p:column width="18%" headerText="date" sortBy="#{comment.changedOn}"
styleClass="align-top"
sortOrder="DESCENDING">
<h:outputText value="#{comment.changedOn eq null ?
(comment.createdOn eq null ? '': comment.createdOn) : comment.changedOn}">
<f:convertDateTime type="date" pattern="dd.MM.yyyy" timeZone="CET"/>
</h:outputText>
</p:column>
<p:column width="30%" headerText="Text">
<p:cellEditor>
<f:facet name="output">
<span style="width: 100%; height: 100%">
<h:outputText escape="true" style="white-space:pre-line;"
id="commentDisplay"
value="#{comment.text.length() > 200 ? comment.text.substring(0, 200).concat(' ...'): comment.text}">
</h:outputText>
<p:tooltip id="commentDisplayToolTip"
for="commentDisplay,commentDisplayToolTipTxt"
rendered="#{comment.text.length() gt 200}"
beforeShow="$('.ui-tooltip:visible').hide()"
myPosition="left bottom" atPosition="right bottom"
hideDelay="500">
<p:outputLabel id="commentDisplayToolTipTxt"
styleClass="scrollOutputLabel"
value="#{comment.text}"/>
</p:tooltip>
</span>
</f:facet>
<f:facet name="input">
<p:message for="text" id="nameMsg"/>
<p:inputTextarea value="#{comment.text}" id="text"
onkeypress="setConfirmUnload(true); if ((($.browser.mozilla && event.ctrlKey && event.keyCode==13) ||(($.browser.msie||$.browser.chrome) && event.ctrlKey))
&& (! (event.altKey && event.ctrlKey)))
{$('.editTable tbody.ui-datatable-data tr td .ui-icon-check:visible').click(); $('#buttonForm\\:speichern').addClass('unsaved'); setConfirmUnload(true); }"
title="Text"
styleClass="Wid90 input_mandatory focus_comment">
</p:inputTextarea>
</f:facet>
</p:cellEditor>
</p:column>
<p:column width="30%" headerText="author" sortBy="#{comment.changedBy}"
styleClass="align-top"
sortOrder="DESCENDING">
<h:outputText
value="#{comment.changedBy eq null ?
(comment.createdBy eq null ? '' : commentController.extractUserData(comment.createdBy))
:commentController.extractUserData(comment.changedBy)}"/>
</p:column>
<p:column width="83" id="editor" styleClass="NoPadding align-top">
<p:rowEditor/>
<h:panelGroup id="deleteSpan">
<p:commandButton id="delete" partialSubmit="true"
style="height: 41px;"
title="Löschen"
action="#{commentController.removeComment(comment)}"
update="commentTable"
process="@this commentTable"
immediate="true"
icon="fa fa-close"
iconPos="center"
styleClass="deleteButton Fright"
disabled="#{empty commentForm.project.Comments}">
<p:confirm header="Confirmation" message="Delete Comment?"
icon="ui-icon-alert"/>
</p:commandButton>
</h:panelGroup>
</p:column>
</p:dataTable>
</p:fieldset>
</h:form>
</div>
そして、これはコントローラです：
@Named("commentController")
@RequestScoped
public class CommentController {
// this method is executed when pressing the add-comment button:
public void addComment() {
Comment comment = new Comment();
commentForm.setComment(comment);
final DataTable commentTable = (DataTable) FacesContext.getCurrentInstance().getViewRoot().findComponent("commentsForm:commentTable");
if (commentTable != null) {
commentTable.setValueExpression("sortBy", null);
commentTable.setValueExpression("sortOrder", null);
}
comment.setProject(projectForm.getProject);
projectForm.getProject().getComments().add(comment);
if (commentTable) {
commentTable.processValidators(getFacesContext());
}
}
// not really relevant for my question, because:
// this method is only called when properly ending the rowEdit by pressing the green check
public void onRowEdit(RowEditEvent event) {
Comment comment = (Comment) event.getObject();
if (!validateComment(comment)) {
getFacesContext().validationFailed();
} else {
if (comment.getId() != 0 && commentForm.getProject().getComments().contains(comment)) {
projectForm.getProject().getComments().set(commentForm.getProject().getComments().indexOf(comment), comment);
}
commentForm.setEditMode(false);
}
}
}
私は'この記事を見つけた後https://stackoverflow.com/a/44710044/6426882 –
Robert