Javascript Primefaces:数据表清除/重置行数据无效

Javascript Primefaces:数据表清除/重置行数据无效,javascript,jsf,primefaces,Javascript,Jsf,Primefaces,我试图使用java脚本清除数据表行中的输入数据 这是我的jsf代码 <p:dataTable var="line" id="addExpenseDataTable" rowIndexVar="row" value="#{myexpense.form.addExpenseEntryList}"> <p:column styleClass="centerAlignColumn" width="5%">

我试图使用java脚本清除数据表行中的输入数据

这是我的jsf代码

<p:dataTable var="line" id="addExpenseDataTable" rowIndexVar="row" value="#{myexpense.form.addExpenseEntryList}">
                    <p:column  styleClass="centerAlignColumn" width="5%">
                        <p:commandButton id="copy" onclick="copy('#{row}');" partialSubmit="true" ajax="true" title="Copy" icon="ui-icon-copy" rendered="#{row==1 || row==0 }"/>
                        <p:commandButton id="clear" onclick="clearMe('#{row}');" immediate="true" partialSubmit="true" ajax="true" title="Clear" icon="ui-icon-close"/>
                    </p:column>
                    <p:column headerText="#{tk.expense_table_expenseOccurredDate}"
                        styleClass="centerAlignColumn" width="8%">
                        <p:calendar id="mask1" value="#{line.expenseOccurredDate}"
                            required="#{not empty line.amount or not empty line.activityId or not empty line.vatAmount or not empty line.comment or not empty line.expenseType}"
                            requiredMessage="#{tk.expense_table_mandatory_expenseOccurredDate}"
                            label="#{tk.expense_table_expenseOccurredDate}"
                            pattern="#{myexpense.datePattern}" styleClass="expenseDate"
                            timeZone="#{myexpense.timeZone}" locale="#{localeBean.locale}"
                            rendered="#{line.editable}"
                            mindate="#{myexpense.minimumFromDate}"
                            maxdate="#{myexpense.maxExpenseOccurredDate}">
                            <f:validator validatorId="dateRangeValidator"></f:validator>
                            <f:attribute name="localeCode" value="#{localeBean.localeCode}" />
                            <p:ajax event="dateSelect" oncomplete="document.getElementById('myExpenseForm:addExpenseDataTable:#{row}:mask1_input').focus()"
                                process="@this" partialSubmit="true"/>
                        </p:calendar>
                    </p:column>
                    <p:column headerText="#{tk.expense_table_activityId}"
                        styleClass="centerAlignColumn">
                        <p:selectOneMenu value="#{line.activityId}"
                            filter="true" filterMatchMode="contains"
                            required="#{not empty line.expenseOccurredDate or not empty line.amount or not empty line.vatAmount or not empty line.comment or not empty line.expenseType}"
                            requiredMessage="#{tk.expense_table_mandatory_activityId}"
                            rendered="#{line.editable}" id="activityId1">
                            <f:selectItem itemLabel="#{tk.expense_table_select_activityId}" />
                            <f:selectItems value="#{myexpense.activityList}" />
                            <p:ajax process="@this" partialSubmit="true" />
                        </p:selectOneMenu>
                    </p:column>
                    <p:column headerText="#{tk.expense_table_comment}"
                        styleClass="centerAlignColumn">
                        <p:inputTextarea rows="2" cols="25" counter="display"
                            value="#{line.comment}" rendered="#{line.editable}" id="comment1"
                            maxlength="#{myexpense.maxCommentLength}"
                            counterTemplate="#{tk.expense_text_area_content_template}"
                            autoResize="false">
                            <p:ajax process="@this" partialSubmit="true"/>
                        </p:inputTextarea>
                        <h:outputText id="display" />
                    </p:column>
                    <p:column headerText="#{tk.expense_table_amount_excl}"
                        styleClass="centerAlignColumn" width="10%">
                        <pe:inputNumber id="amountExcl1" value="#{line.amount}"
                            rendered="#{line.editable}"
                            required="#{not empty line.expenseOccurredDate or not empty line.vatAmount or not empty line.comment or not empty line.expenseType or not empty line.activityId}"
                            requiredMessage="#{tk.expense_table_mandatory_amount}">
                            <p:ajax event="blur" update="amountIncl1"/>  
                        </pe:inputNumber>
                    </p:column>
                    <p:column headerText="#{tk.expense_table_vatAmount}"
                        styleClass="centerAlignColumn" width="10%">
                        <pe:inputNumber id="vat1" value="#{line.vatAmount}"
                            rendered="#{line.editable}">
                            <p:ajax event="blur" update="amountIncl1"/>  
                        </pe:inputNumber>
                    </p:column>
                    <p:column headerText="#{tk.expense_table_amount_incl}"
                        styleClass="rightAlignColumn" width="10%">
                        <h:outputText id="amountIncl1" value="#{line.amount+line.vatAmount}">
                            <f:convertNumber pattern="#{myexpense.numberPattern}" locale="#{localeBean.localeCode}"/>
                        </h:outputText>
                        <h:outputText escape="false" value=" #{tk.menu_currency_symbol}" />
                    </p:column>
                    <p:column headerText="#{tk.expense_table_expenseTypeList}"
                        styleClass="centerAlignColumn">
                        <p:selectOneMenu value="#{line.expenseType}" id="expenseType1"
                            required="#{not empty line.expenseOccurredDate or not empty line.amount or not empty line.comment or not empty line.vatAmount or not empty line.activityId}"
                            requiredMessage="#{tk.expense_table_mandatory_expenseType}">
                            <f:selectItem itemLabel="#{tk.expense_table_select_expenseType}" />
                            <f:selectItems value="#{applicationController.expenseTypeList}" />
                            <p:ajax process="@this" partialSubmit="true"/>
                        </p:selectOneMenu>
                    </p:column>
                    <p:column headerText="#{tk.expense_table_statusList}"
                        styleClass="centerAlignColumn" width="7%">
                        <h:outputText value="#{line.status}" />
                    </p:column>
                    <f:facet name="footer">
                        <p:commandButton process=":myExpenseForm:lazyDataTable addExpenseDataTable" partialSubmit="true"  ajax="true"
                            value="#{tk.expense_saveAsDraft}" id="xyz"
                            actionListener="#{myexpense.saveAsDraft}" update=":myExpenseForm:lazyDataTable addExpenseDataTable @form"
                            rendered="#{myexpense.form.myOnly and myexpense.userIdSearch eq null}" />
                        <p:commandButton process=":myExpenseForm:lazyDataTable addExpenseDataTable" value="#{tk.expense_submit}" partialSubmit="true"  ajax="true"
                            id="a07" actionListener="#{myexpense.submitNotSavedBody}"
                            update=":myExpenseForm:lazyDataTable addExpenseDataTable @form :myExpenseForm:selectUser" rendered="#{myexpense.form.myOnly}" />
                    </f:facet>
                </p:dataTable>
问题是,当我输入ExpenseCurrendDate并单击UI上的Clear按钮时,该值消失。但当我点击另存为草稿/提交按钮时,ExpenseCurrendDate重新出现。需要多次单击“清除”按钮才能正常工作。这个问题的根本原因是什么?我如何解决这个问题

这里是点击清除按钮后的屏幕截图

我需要点击两次清除按钮才能正常工作


我正在使用Primefaces 5.2

如何解决此问题

我已将widgetVar用于selectOneMenu

<p:selectOneMenu value="#{line.activityId}"
                            widgetVar="activityId_#{row}"
                            filter="true" filterMatchMode="contains"
                            required="#{not empty line.expenseOccurredDate or not empty line.amount or not empty line.vatAmount or not empty line.comment or not empty line.expenseType}"
                            requiredMessage="#{tk.expense_table_mandatory_activityId}"
                            rendered="#{line.editable}" id="activityId1">
                            <f:selectItem itemLabel="#{tk.expense_table_select_activityId}" />
                            <f:selectItems value="#{myexpense.activityList}" />
                            <p:ajax process="@this" partialSubmit="true" />
                        </p:selectOneMenu>


<p:selectOneMenu value="#{line.expenseType}" id="expenseType1"
                            widgetVar="expenseType_#{row}"
                            required="#{not empty line.expenseOccurredDate or not empty line.amount or not empty line.comment or not empty line.vatAmount or not empty line.activityId}"
                            requiredMessage="#{tk.expense_table_mandatory_expenseType}">
                            <f:selectItem itemLabel="#{tk.expense_table_select_expenseType}" />
                            <f:selectItems value="#{applicationController.expenseTypeList}" />
                            <p:ajax process="@this" partialSubmit="true"/>
                        </p:selectOneMenu>
现在,它看起来像预期的那样工作

<p:selectOneMenu value="#{line.activityId}"
                            widgetVar="activityId_#{row}"
                            filter="true" filterMatchMode="contains"
                            required="#{not empty line.expenseOccurredDate or not empty line.amount or not empty line.vatAmount or not empty line.comment or not empty line.expenseType}"
                            requiredMessage="#{tk.expense_table_mandatory_activityId}"
                            rendered="#{line.editable}" id="activityId1">
                            <f:selectItem itemLabel="#{tk.expense_table_select_activityId}" />
                            <f:selectItems value="#{myexpense.activityList}" />
                            <p:ajax process="@this" partialSubmit="true" />
                        </p:selectOneMenu>


<p:selectOneMenu value="#{line.expenseType}" id="expenseType1"
                            widgetVar="expenseType_#{row}"
                            required="#{not empty line.expenseOccurredDate or not empty line.amount or not empty line.comment or not empty line.vatAmount or not empty line.activityId}"
                            requiredMessage="#{tk.expense_table_mandatory_expenseType}">
                            <f:selectItem itemLabel="#{tk.expense_table_select_expenseType}" />
                            <f:selectItems value="#{applicationController.expenseTypeList}" />
                            <p:ajax process="@this" partialSubmit="true"/>
                        </p:selectOneMenu>
PF('activityId_'+rowIndex).refresh();
PF('expenseType_'+rowIndex).refresh();