2

我有一个数据表,其中每一行都有 24 小时输入字段。在某一时间点有超过 1000 个可编辑的输入字段。我注意到在 ajax 调用期间使用 p:cellEditor 时,primefaces 正在提交整个数据表。我怎样才能避免这种情况?请在下面找到我拥有的代码,并在其中找到每个重要部分的注释。

        <!-- Fires the cellEdit event to trigger the validations to happen as user tabs out of the input box -->
    <p:ajax event="cellEdit" listener="#{renderValidator.onCellEdit}"  update=":#{p:component('globalMessages')}" process="@this" /> 

    <p:column id="hour1" styleClass="col-right col-90">
        <f:facet name="header">
            <h:outputText value="1" escape="false"/>
        </f:facet>
        <p:cellEditor > 

            <f:facet name="output">
            <h:outputText value="#{row.amount[0]}" escape="false">
            <f:convertNumber  maxFractionDigits="3" minFractionDigits="3" maxIntegerDigits="5" />
            </h:outputText>
            </f:facet> 
            <f:facet name="input">
            <p:inputText id="hour1Input" value="#{row.amount[0]}" maxlength="10" size="10"  readonly="#{row.readOnly}" onchange='PowerMeter.setPowerMeterChange()'
            styleClass="col-right" valueChangeListener="#{row.setDirtyFlag(true)}"  >
            <!-- formats data the way its displayed -->
            <f:convertNumber  maxFractionDigits="3" minFractionDigits="3" maxIntegerDigits="5" />
            <!-- validates the input value w.r.t a custom validator -->
            <f:validator validatorId="hourlyValueValidator" for="hour1Input" /> 
            <!-- javascript restricting user to input alpha numeric characters -->
            <pe:keyFilter testFunction="return PowerMeter.isValidMWH(this, c);" />
            </p:inputText>
            </f:facet>          
        </p:cellEditor>
    </p:column> 
4

2 回答 2

2

在 Ajax 请求上,JSF 默认发送表单中所有输入组件的数据。即使在部分生命周期中只执行了 100 个组件中的一个。partialSubmit使用 PrimeFaces,您可以通过设置如下来更改此行为true

<p:ajax partialSubmit="true" event="cellEdit" process="@this"
    listener="#{renderValidator.onCellEdit}"
    update=":#{p:component('globalMessages')}"/> 
于 2013-04-25T04:45:39.883 回答
0

Primefaces 使用该PrimeFaces.ajax.AjaxUtils.send函数来构建 Ajax 请求。为了确定需要将哪些数据发送到服务器,它使用 jQueryfind函数,然后使用哪些数据serializeArray来构建 POST 请求。

componentPostParams = jqProcess.find(':input').serializeArray();

不幸的是,当启用liveScroll属性<p:DataTable>并且已经获取了大量数据时,它将处理所有输入控件,无论是否<p:cellEditor>只有一个输入方面可见。

只有一个输入元素可见的数据表

PrimeFaces.ajax.AjaxUtils.send要更改此功能,我以以下形式 覆盖了功能

var pFacesSend = PrimeFaces.ajax.AjaxUtils.send;
PrimeFaces.ajax.AjaxUtils.send = function(cfg) {
    if (myCase) {
        // Custom send
    } else {
        pFacesSend(cfg);
    }
};

myCase我从这个改变了另外的序列化:

componentPostParams = jqProcess.find(':input').serializeArray();

进入这个:

if (!customSerializationCondition) {
    componentPostParams = jqProcess.find(':input').serializeArray();
} else {
    componentPostParams = jqProcess.find(':input').filter(function() {
        return $(this).parent().css('display') !== 'none';
    }).serializeArray();
}

此解决方案构建了一个仅包含可见输入字段的 POST 请求,并且由于我的editMode设置为单元格,我只有一个<input>可见的。它适用于Primefaces v4.0,并且只要输入父标签使用 cssdisplay属性在编辑器中隐藏输入方面,它就应该工作。

于 2014-04-02T13:51:17.040 回答