Tengo un datatable que tiene uno de sus columnas editable. Mi problema es que cuando escribo en una de las casillas de esa columna me sucede alguna de estas situaciones.
1. No hace focus en el primer intento: le doy click a la casilla pero el cursos no se queda y como que es rechazado. Tengo que darle click a otro lado de la tabla y volver a la casilla. Hasta en casos extremos tengo que usar el f5.
2. Se elimina el dato ingresado: cuando estoy ingresando una cantidad y le doy enter (o click a otro lado) para terminar la acción y seguir con fila siguiente, el dato que acabo de escribir se borra. Y tengo que repetir la acción o hacer f5.
3. No me permite agregar más filas: esto ya no es algo del problema de la casilla pero si pertenece a la misma vista del datatable en cuestión. Este datatable tiene un botón para agregar más detalles. El botón me lleva a otro dialog con su datatable del cual selecciono los detalles a agregar. Pero sucede que a veces al agregar un nuevo detalle, el datatable dónde tendría que agregarse se limpia completamente. Y toca f5. Esto sucede luego de hacer un par de pruebas.
4. Al quitar un detalle: esto es muy similar al punto 3. Con un poco de uso al hacer las pruebas me limpia todo el datatable al querer sacar una de las filas. En los primeros intentos todo funciona bien pero luego se comportan así.
En ninguno de los casos se muestra en error en la aplicación. Es por eso que no tengo dónde ver que le pasa. Por favor necesito un poco de luces al menos para saber por dónde buscar o como haría una mejor consulta. Dejo el código de la vista por si acaso.
<h:form id="formNuevaNotaDespacho">
<p:messages id="msgs" />
<p:dialog id="dlgNuevaNotaDespacho" widgetVar="dialogNuevaNotaDespacho"
focus="#{notaDespachoBean.nameFocus}" resizable="false"
modal="true" width="1270" height="410"
header="Registro de Nota de despacho" styleClass=".ui-dialog-title-dialog{ margin:0px;}">
<p:panelGrid id="gridNotaDespachoCab">
<p:row>
<p:column>
<p:outputLabel for="numND" value="N° Despacho:" style="display:block; width:70px;"/>
</p:column>
<p:column>
<p:inputText id="numND" value="#{notaDespachoBean.notaDespacho.numVale}"
style="width:70px; font-weight:bold;" disabled="#{notaDespachoBean.enabledND}"/>
</p:column>
<p:column>
<p:outputLabel for="fecha" value="Fecha:"/>
</p:column>
<p:column>
<p:calendar id="fecha" value="#{notaDespachoBean.notaDespacho.fecVale}"
pattern="dd/MM/yyyy" size="7"/>
</p:column>
<p:column>
</p:column>
<p:column>
<p:outputLabel value="Vendedor:"/>
</p:column>
<p:column>
<p:inputText value="#{notaDespachoBean.notaDespacho.agmaeVendedor.nomVendedor}"
style="width:240px" disabled="true"/>
</p:column>
<p:column>
<p:commandButton style="width:30px; height: 17px; " icon="ui-icon-search"
oncomplete="PF('dialogConsultarVendedor').show();" />
</p:column>
<p:column>
<p:outputLabel value="Prioridad:" />
</p:column>
<p:column>
<p:selectOneMenu value="#{notaDespachoBean.notaDespacho.codPrioridad}" style="width:50px;" >
<f:selectItem itemLabel="NORMAL" itemValue="1" />
<f:selectItem itemLabel="BAJA" itemValue="2" />
<f:selectItem itemLabel="ALTA" itemValue="3" />
</p:selectOneMenu>
</p:column>
<p:column>
<p:outputLabel for="estado" value="Estado:" />
</p:column>
<p:column>
<p:selectOneMenu id="estado" value="#{notaDespachoBean.notaDespacho.flgEstado}" style="width: 70px;" >
<f:selectItems value="#{notaDespachoBean.listaEstadoTipoDocumento}"
var="es" itemLabel="#{es.desEstado}"
itemValue="#{es.codEstado}" />
</p:selectOneMenu>
</p:column>
</p:row>
<p:row>
<p:column>
<p:outputLabel value="Cliente:" style="display:block; width:60px;"/>
</p:column>
<p:column colspan="3">
<p:inputText id="txtCliente"
value="#{notaDespachoBean.notaDespacho.agmaePersona.numIdentificacion}-#{notaDespachoBean.notaDespacho.agmaePersona.nomRazonSocial}"
style="width:270px" disabled="true" />
</p:column>
<p:column>
<p:commandButton style="width:30px; height: 17px; " icon="ui-icon-search"
oncomplete="PF('dialogConsultarCliente').show();"/>
</p:column>
<p:column>
<p:outputLabel value="Observacion:" />
</p:column>
<p:column colspan="6">
<p:inputText value="#{notaDespachoBean.notaDespacho.desObservacion}" style="width:100%"/>
</p:column>
</p:row>
</p:panelGrid>
<p:remoteCommand name="onCellEdit" update=":formNuevaNotaDespacho:tablaNotaDespachoDetalle" />
<p:dataTable id="tablaNotaDespachoDetalle"
var="ndd" value="#{notaDespachoBean.listaNotaDespachoDetalle}"
selectionMode="single"
selection="#{notaDespachoBean.notaDespachoDetalle}"
rowKey="#{ndd.idMovValeProducto}"
rowIndexVar="rowIndex"
emptyMessage="No hay datos de detalle" scrollable="true" scrollHeight="220"
editable="true" editMode="cell"
rowStyleClass="#{ndd.numCantidadPresentacion le 1 ? 'alert' : null}">
<f:facet name="header">
<p:commandButton process="formNuevaNotaDespacho" icon="ui-icon-plus"
value="Agregar Producto"
actionListener="#{notaDespachoBean.prepararAgregarProducto}"
update=":formAgregarProducto :formNuevaNotaDespacho:msgs" />
</f:facet>
<p:ajax event="cellEdit" listener="#{notaDespachoBean.onCellEdit(rowIndex, ndd)}" onstart="onCellEdit()" update=":formNuevaNotaDespacho:msgs"/>
<p:column headerText="No" width="15" >
<h:outputText value="#{rowIndex+1}"/>
</p:column>
<p:column headerText="Ruc Compañia" width="70" style="align-content:center;">
<h:outputText value="#{ndd.rucCompanyia}" />
</p:column>
<p:column headerText="Nombre de Compañia" width="160">
<h:outputText value="#{ndd.nomCompanya.toUpperCase()}" />
</p:column>
<p:column headerText="Codigo producto" width="60">
<h:outputText value="#{ndd.codProducto}"/>
</p:column>
<p:column headerText="Nombre del producto" width="200">
<h:outputText value="#{ndd.nomProducto}"/>
</p:column>
<p:column headerText="Presentacion" width="60">
<p:cellEditor>
<f:facet name="output">
<p:outputLabel value="#{ndd.nomPresentacion}" />
</f:facet>
<f:facet name="input">
<h:selectOneMenu value="#{ndd.nomPresentacion}" style="width:100%">
<f:selectItem itemLabel="UNIDAD" itemValue="UNIDAD" />
</h:selectOneMenu>
</f:facet>
</p:cellEditor>
</p:column>
<p:column headerText="Cantidad Presentacion" width="50">
<p:cellEditor>
<f:facet name="output">
<h:outputText value="#{ndd.numCantidadPresentacion}"/>
</f:facet>
<f:facet name="input">
<h:inputText id="txtcantpre" value="#{ndd.numCantidadPresentacion}" style="width:96%;" />
</f:facet>
<p:message for="txtcantpre" display="icon" />
</p:cellEditor>
</p:column>
<p:column headerText="Unidad Medida" width="50">
<p:outputLabel value="#{ndd.nomMedida}" />
</p:column>
<p:column headerText="Cantidad" width="40">
<p:cellEditor>
<f:facet name="output"><h:outputText value="#{ndd.ctdMovimiento}" /></f:facet>
<f:facet name="input"><h:inputText id="modelInput" value="#{ndd.ctdMovimiento}" style="width:96%"/></f:facet>
</p:cellEditor>
</p:column>
<p:column headerText="Stock Fecha" width="40">
<p:outputLabel value="#{ndd.stockFecha}" />
</p:column>
<p:column headerText="Stock Actual" width="40">
<p:outputLabel value="#{ndd.stockActual}" />
</p:column>
<p:column headerText="Opciones" width="40" style="text-align:center;" >
<p:commandButton id="delButton" icon="ui-icon-trash" title="Eliminar" style="width:17px; height: 17px;"
actionListener="#{notaDespachoBean.quitarNotaDespachodetalle(ndd, rowIndex)}"
update=":formNuevaNotaDespacho:tablaNotaDespachoDetalle :formNuevaNotaDespacho:gridNotaDespachoCab"/>
</p:column>
</p:dataTable>
<center>
<p:commandButton value="#{notaDespachoBean.nameBtnSave}"
actionListener="#{notaDespachoBean.guardarNotaDespacho()}"
update=":formNotaDespachos:tablaNotaDespachos :formNotaDespachos:msgs :formNuevaNotaDespacho:msgs" />
<p:spacer width="30"/>
<p:commandButton value="Cancelar" oncomplete="PF('dialogNuevaNotaDespacho').hide();" />
</center>
</p:dialog>
</h:form>
<p:ajax event="cellEdit" ... onstart="onCellEdit()" ...
y<p:remoteCommand name="onCellEdit" update=":formNuevaNotaDespacho:tablaNotaDespachoDetalle" />
, estas actualizando la tabla completa al cambiar unicamente una celda, nisiquiera al final del cambio, sino al principio. Esto te puede causar los problemas 1 y 2.