Navigating from af:Quick Query To af:query

This was my first post regarding the navigation of af:quickQuery panel to af:query panel
Initially i had created my ViewCriteria in my VO namely GlJrnlHdVOCriteriaQuery.I had dragged and dropped my ViewCriteria as my af:query in my jspx page and add a command button in that tool bar such that if user press the command button it can be navigates to af:quick query.

 <af:query id="qryId1" headerText="Search" disclosed="true"

                  value="#{bindings.GlJrnlHdVOCriteriaQuery.queryDescriptor}"

                  model="#{bindings.GlJrnlHdVOCriteriaQuery.queryModel}"

                  queryListener="#{bindings.GlJrnlHdVOCriteriaQuery.processQuery}"

                  queryOperationListener="#{bindings.GlJrnlHdVOCriteriaQuery.processQueryOperation}"

                  binding="#{backingBeanScope.GeneralJournal.qryId1}"

                      rendered="#{backingBeanScope.GeneralJournal.queryVisible}"

                      modeChangeVisible="false" rows="1" maxColumns="5">

                      <f:facet name="toolbar">

        <af:commandButton text="Basic"

                          binding="#{backingBeanScope.GeneralJournal.cb2}"

                          id="cb2"

                          actionListener="#{backingBeanScope.GeneralJournal.advanced2Quick}"/>

                          </f:facet>

Now Drag and drop an adf:quickQuery to your jspx page and provide value,model,querylistner and query operation listner ., In this i simply copied and pasted all this from af:query.Initially the command link advance property will be false make it as true so it will be visible in the UI.

<af:quickQuery label="Search"

      value="#{bindings.GlJrnlHdVOCriteriaQuery.queryDescriptor}"

                    model="#{bindings.GlJrnlHdVOCriteriaQuery.queryModel}"

                    queryListener="#{bindings.GlJrnlHdVOCriteriaQuery.processQuery}"

                    queryOperationListener="#{bindings.GlJrnlHdVOCriteriaQuery.processQueryOperation}"

                     binding="#{backingBeanScope.GeneralJournal.qq1}" id="qq1"

                     rendered="#{backingBeanScope.GeneralJournal.quickQueryVisible}">

        <f:facet name="end">

          <af:group binding="#{backingBeanScope.GeneralJournal.g1}" id="g1">

            <af:commandLink text="Advanced" visible="true"

                            binding="#{backingBeanScope.GeneralJournal.cl1}"

                            actionListener="#{backingBeanScope.GeneralJournal.quick2Advanced}"

                            id="cl1"/>

</af:group>

      </f:facet>

Here i had two methods quick2advanced and advance2quick which provides the render property in the UI
Here is the following methods that had been used in the Managed Bean

public boolean isQuickQueryVisible()

                {

                  return _quickQueryVisible;

                }

             

                public boolean isQueryVisible()

                {

                  return !_quickQueryVisible;

                }

                 

                public String getVisibleComponent()

                {

                  if(_quickQueryVisible)

                    return "quick";

                  else

                    return "advanced";

                }

             

        private boolean _quickQueryVisible = true;

            public void quick2Advanced(ActionEvent actionEvent) {

            // Add event code here...

            _quickQueryVisible = !_quickQueryVisible;

    }

        public void advanced2Quick(ActionEvent actionEvent) {

            // Add event code here...

            _quickQueryVisible = !_quickQueryVisible;

    }

Initially the rendering property of af:quickQuery  quickQueryVisible is true such that it would be visible in the UI Now when the user clicks the advance button the rendering property of af:quickquery will get false such that it enables the af:query to be visible in UI. Now we are using Switcher Component to switch from af:quickquery to af:query

<af:switcher facetName="#{demoQueryToggle.visibleComponent}" defaultFacet="quick"

                         id="s4">

              <f:facet name="advanced">

                <af:outputText id="resultTextId"

                               value="Query statement is as folows: #{demoQuery.sqlString}"/>

              </f:facet>

              <f:facet name="quick">

                <af:outputText value="#{demoQuickQuery.sqlString}" partialTriggers="search"

                               id="ot5"/>

              </f:facet>

            </af:switcher>

Thus the following result is obtained

Now if the user clicks the Advance button it navigates from af:quickquery to af:query Then if the user clicks Basic button it navigates from af:query to af:quickQuery