<ui:component>
        <a4j:form id="formCamposAsignarASap">
            <h:panelGroup>
                <fieldset>
                    <legend>#{msg.label_listado_campos_seleccionados}</legend>
                    <rich:spacer/>
                    <rich:dataTable id="tablaListadocampos" value="#{AsignarASapBB.listaCamposElementoSeleccionado}"
                                    var="campo" rows="30" rowKeyVar="row"
                                    ajaxKeys="#{AsignarASapBB.rowsToUpdateCampos}"
                                    reRender="ds" align="left" >
                            <rich:column sortable="true" sortBy="#{campo.nombre}" filterBy="#{campo.nombre}" filterEvent="onkeyup" style="text-align: left">
                                <f:facet name="header">
                                    <h:outputText value="#{msg.label_nombre_campo}" />
                                </f:facet>
                                <h:outputText value="#{campo.nombre}" id="nomCampo" style="text-align: right" />
                            </rich:column>

                            <rich:column sortable="true" sortBy="#{campo.campoSapVO.pk.idCampoSap}" filterBy="#{campo.campoSapVO.pk.idCampoSap}" filterEvent="onkeyup" style="text-align: left">
                                <f:facet name="header">
                                    <h:outputText value="#{msg.label_id_camposap}" />
                                </f:facet>
                                 <a4j:region>
                                 <h:inputText id="text" value="#{campo.campoSapVO.nombre}" >
                                    <a4j:support ajaxSingle="true" event="onblur"/>
                                 </h:inputText>

                                     <rich:suggestionbox for="text"
                                                var="result"
                                                suggestionAction="#{AsignarASapBB.autocomplete}"
                                                fetchValue="#{result.value}"
                                                usingSuggestObjects="true"
                                                id="suggestion"
                                                selfRendered="true">
                                        <h:column>
                                            <h:outputText value="#{result.value}" />
                                        </h:column>
                                        <a4j:ajaxListener type="org.ajax4jsf.ajax.ForceRender"/>
                                    </rich:suggestionbox>
                                </a4j:region>

                            </rich:column>

                            <f:facet name="footer">
                                <rich:datascroller id="ds" renderIfSinglePage="false" />
                            </f:facet>
                        </rich:dataTable>

                        <rich:spacer width="150"/>

                        <a4j:region rendered="#{!(AsignarASapBB.listaCamposElementoSeleccionado eq null)}">
                        <dggc:boton id="botonAsignar"
                                    value="#{msg.label_nueva_ayuda_botonGuardar}"
                                    styleLabel="bold"
                                    style="width:100px"
                                    bean="#{AsignarASapBB}"
                                    accion="botonAsignarASap"
                                    status="waitStatus"
                                    tabindex="12"
                                    oncomplete="#{rich:component('panelCONF')}.show();"/>
                            </a4j:region>

                        <rich:spacer width="10"/>
                    <center>

                    </center>
                </fieldset>

            </h:panelGroup>

        </a4j:form>

    </ui:component>