0 Replies Latest reply on Mar 10, 2010 6:07 AM by Daniel Kim

    Validation in rich:modalpanel

    Daniel Kim Newbie
      Hi,

      I am using rich modalPanel that takes user input and the way I am try to validate is like this:

      If user enters non numeric value or minus value, I want to throw error message on the top of rich dataTable and put red border for the input field.

      So far, what I was able to do was just throw message right below the input field and this is the code.

      '
      <?xml version="1.0" encoding="UTF-8"?>
      <page xmlns="http://jboss.com/products/seam/pages"
           xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
           xsi:schemaLocation="http://jboss.com/products/seam/pages http://jboss.com/products/seam/pages-2.1.xsd">


      <ui:composition xmlns="http://www.w3.org/1999/xhtml"
           xmlns:s="http://jboss.com/products/seam/taglib"
           xmlns:ui="http://java.sun.com/jsf/facelets"
           xmlns:f="http://java.sun.com/jsf/core"
           xmlns:h="http://java.sun.com/jsf/html"
           xmlns:a4j="http://richfaces.org/a4j"
           xmlns:rich="http://richfaces.org/rich">



           

                <a4j:outputPanel ajaxRendered="true">
                     <h:form style="display:none" prependId="false">
                          <h:inputHidden id="maximumSeverity"
                               value="#{facesContext.maximumSeverity.ordinal}" />
                     </h:form>
                </a4j:outputPanel>


                <script type="text/javascript">
                function ajaxRequestContainsErrors() {
                     return document.getElementById("maximumSeverity").value == "2";
                }
           </script>


                <rich:modalPanel id="kpataMp2" width="1200" height="200"
                     resizeable="true" moveable="true">



                     <f:facet name="header">
                    KPATA
                   </f:facet>

                     <h:form id="kpataFormMp2">

                          <rich:dataTable value="columns.data2" var="data2" id="kpataRd2"
                               style="{border: 2px solid}">


                               <h:messages id="messagesMp" globalOnly="true" styleClass="message"
                                    errorClass="errormsg" infoClass="infomsg" warnClass="warnmsg"
                                    rendered="#{showGlobalMessages != 'false'}" />


                               <ui:include src="/includes/IndicatorMpHeader.xhtml" />
      ...
      ...
      ...
                               <rich:column align="center" breakBefore="true">
                                    <h:outputText value="1. # of children served through KPATA" />
                               </rich:column>
                               <rich:column align="center" id="cherokeeCol"
                                    template="layout/edit.xhtml">
                                    
                                    <h:inputText id="cherokee" size="5" maxlength="5"
                                         value="#{kpataList.resultList.get(1).cherokee}"
                                         style="text-align:center" required="true">
                                         <a4j:support event="onblur" reRender="cherokee"
                                               bypassUpdates="true" ajaxSingle="true" />
                                           <rich:beanValidator summary="Invalid number"/>
                                    </h:inputText>
                                    <br/><h:message for="cherokee" style="color:red;font-size:11px" />
                                    
                               </rich:column>

      ...
      ...
      ...
                          </rich:dataTable>

                          <h:panelGrid columns="2">

                               <a4j:commandButton id="save" value="Save"
                                    action="#{countyHome.validateCountyInput}"
                                    reRender="kpataFormMp2, kpata"
                                    data="#{facesContext.maximumSeverity.ordinal ge 2}"
                                    oncomplete="if(data == false) Richfaces.hideModalPanel('kpataMp2');">


                               </a4j:commandButton>
                               <a4j:commandButton value="Cancel"
                                    onclick="#{rich:component('kpataMp2')}.hide();return false"
                                    reRender="kpataFormMp2, kpata" />

                          </h:panelGrid>



                     </h:form>

                </rich:modalPanel>
           
      </ui:composition>

      </page>
      '

      can anybody help me on this?

      thanks in advance
      Daniel