Navigate after successfull action on commandButton

Question

I am building a JSF application using Primefaces mobile (0.9.3 with Primefaces 3.5). I hava a login page, on this login page there is a login button defined as followed:

<p:commandButton value="#{msg['label.login']}" action="#{loginBean.login}" update="usernameMsg" />

The loginBean.login method is defined as followed:

public String login() {
try {
    //do login
    return "#loggedInTarget?transition=fade";
} catch (UserNotValidException e) {
    //User not valid, display exception
    FacesContext
            .getCurrentInstance()
            .addMessage(
                    "loginForm:username",
                    new FacesMessage(
                            FacesMessage.SEVERITY_ERROR,
                            "",
                            messageService
                                    .getMessage("error.message.loginNotSuccessfull")));
} 
return null;

}

In my main xhtml (the same in which the button is defined), I have defined the following addtional views:

<pm:view id="registerTarget">
        <ui:include
            src="/WEB-INF/c52bc19d58a64ae4bd12dec187a2d4b7/register.xhtml" />
    </pm:view>
    <pm:view id="loggedInTarget">
        TEST
    </pm:view>

I do it that way because I want to use transitions within Primefaces mobile. To get to the register page I use a p:button which works fine:

<p:button value="#{msg['label.register']}"
                        href="#registerTarget?transition=fade" />

Why is my login button not working? I also tried to put in "#loggedInTarget?transition=fade" directly as action, but this didn't work either :(

I need the action, because I have to check if the user credentials are valid. If they are valid I want to display my loggedInTarget.

How can I achieve it?

Thanks in advance!

EDIT: The button is inside a form.

Answer 1

The navigation case outcome value must represent a view ID, not an URL (for sure not a hash fragment). Try with <p:button outcome="...">, and you'll see that it fails over there as well.

Your closest bet is sending a redirect.

public void login() throws IOException {
    // ...
    externalContext.redirect("#loggedInTarget?transition=fade");
    // ...
}

This is also exactly what the <p:button href="..."> does under the covers: causing a GET request on the given URL.