javaajaxjsfcommandbuttonuiinclude

how to send value from commandButton to java bean to change ui


I'm new to jsf. I'm trying to send value to java bean from commandButton to change src in ui:include and render it with ajax so I when clicked commandButton I could refresh part from the page without load the whole page and below is my code

\\\\\\\ The Bean File

import javax.enterprise.context.RequestScoped;
import javax.inject.Named;

@Named("urls")
@RequestScoped

public class URLPagesBean 
{
    private String urlSRC = "";

    public String getUrlSRC() {
        return urlSRC;
    }

    public void setUrlSRC(String urlSRC) {
        this.urlSRC = urlSRC;
    }

    public String getURL()
    {
        String url = "";
        if(urlSRC == "page1" || urlSRC == "" || urlSRC == null)
        {
            url = "page1.xhtml";
        }
        else if (urlSRC == "page2")
        {
            url = "page2.xhtml";
        }
       return url;
    }
}
/////////////

The Index file

\\\\\\\\\\\\\\\\\\\\\\ 

<h:body >
    <h:panelGroup layout="block" styleClass="mainContentBox">
        <h:panelGroup layout="block" styleClass="mainTopBox">
            <h:panelGroup layout="block" styleClass="logoBox"></h:panelGroup>
        </h:panelGroup>
        <h:form id="subMenuForm">
        <h:panelGroup layout="block" styleClass="mainLiftBox">
                <h:panelGroup id="msgBoard" layout="block" styleClass="mainMenuButtons">Message Board
                    <h:panelGroup layout="block" styleClass="subMenuBox">
                        <h:commandButton id="showMsgBoard" styleClass="subMenuButtonCommand" value="Page1"/>
                    </h:panelGroup>
                </h:panelGroup>
                <h:panelGroup layout="block" styleClass="mainMenuButtons">Registrations Book
                        <h:panelGroup layout="block" styleClass="subMenuBox">
                            <h:commandButton id="registrInternalApprov" styleClass="subMenuButtonCommand" value="Page2">
                                <f:ajax render="mainCenterBox" />
                            </h:commandButton>     
                        </h:panelGroup>
                    </h:panelGroup>
          </h:panelGroup>
            <h:panelGroup id="mainCenterBox" styleClass="mainCenterBox" layout="block">
                    <ui:include  id="centerView" src="#{urls.URL}"/>
            </h:panelGroup>
        </h:form>
    </h:panelGroup>
</h:body>

///////////////////////////////////////

page1.xhtml

\\\\\\\\\\\\\\\\\\\\\
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:ui="http://xmlns.jcp.org/jsf/facelets">
    <h:head>
        <title>Page 1</title>
    </h:head>
    <h:body>
        <ui:fragment>
            Page 1
        </ui:fragment>
    </h:body>
</html>
///////////////////////////

page2.xhtml

\\\\\\\\\\\\\\\\\\\\\
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:ui="http://xmlns.jcp.org/jsf/facelets">
    <h:head>
        <title>Page 2</title>
    </h:head>
    <h:body>
        <ui:fragment>
            Page 2
        </ui:fragment>
    </h:body>
</html>
///////////////////////////

Solution

  • Use action attribute of h:commandButton like

    <h:commandButton value="Submit"
        action="#{registrationAction.submitRegistration}" />