Getting Selected Row Data from Datatable in JSF

So, I have tried to implement the methods from Anthony/BalusC in this question: How to get selected row index in JSF datatable? but to no avail. I also went through @BalusC's "Using datatables" article (which is wonderful as always) but that was written for JSF1.2 and the 2.0 article doesn't really address getting the selected row data. When a user clicks the "Add to my favorites" button, the selected row is not getting passed to the backing bean, the navigation case is not being followed, and the current page is refreshed.

Any ideas what I'm doing wrong here?

Here is my backing bean:

    @ManagedBean(name = "selectedBean")
@RequestScoped
public class SelectedBeerBean 
{
    private List<Beer> favoriteBeers;
    private Beer selectedBeer;
    private HtmlDataTable datatableBeers;

    public HtmlDataTable getDatatableBeers() {
        return datatableBeers;
    }

    public void setDatatableBeers(HtmlDataTable datatableBeers) {
        this.datatableBeers = datatableBeers;
    }

    public String addBeer()
    {
        selectedBeer = (Beer) datatableBeers.getRowData();

        return "selectedBeer";
    }

    public List<Beer> getFavoriteBeers() {
        return favoriteBeers;
    }

    public void setFavoriteBeers(List<Beer> favoriteBeers) {
        this.favoriteBeers = favoriteBeers;
    }

    public Beer getSelectedBeer() {
        return selectedBeer;
    }

    public void setSelectedBeer(Beer selectedBeer) {
        this.selectedBeer = selectedBeer;
    }

}

Here is my xhtml page:

<html xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core">
    <h:head>
        <title>Welcome to Draft Savvy, #{draftSavvyController.name}</title>        
    </h:head>
    <h:form>
    <h:body style="background-image: url(Background-Wood.png); ">
        <h3>You searched for "#{draftSavvyController.searchTerm}"</h3>
        <h4>Here are your beers</h4>

        <h:dataTable binding="#{selectedBean.datatableBeers}" value="#{draftSavvyController.beerList}" var="beer" border="1">
           <h:column>
               <f:facet name="header">
                   <h:outputText value="Logo"/>
               </f:facet>
                   <h:graphicImage url="#{beer.icon}"/>            
           </h:column>
           <h:column>
               <f:facet name="header">
                   <h:outputText value="Beer Name"/>
               </f:facet>
                   <h:outputText value="#{beer.name}"/>
           </h:column>        
           <h:column>
               <f:facet name="header">
                   <h:outputText value="Description"/>
               </f:facet>
                   <h:outputText value="#{beer.description}"/>
           </h:column>
           <h:column>
               <f:facet name="header">
                   <h:outputText value="Beer ID"/>
               </f:facet>
                   <h:outputLabel value="#{beer.id}" />
           </h:column>
           <h:column>
               <f:facet name="header">
                   <h:outputText value="Add To My Favorites"/>
               </f:facet>
               <h:commandButton value="Add Beer" action="#{selectedBean.addBeer}">
                   <f:setPropertyActionListener target="#{selectedBean.selectedBeer}" value="#{beer}" />
               </h:commandButton>            
           </h:column>
         </h:dataTable>

    </h:body>
    </h:form>
</html>

the 2.0 article doesn't really address getting the selected row data

It does. Perhaps you're not looking closely enough, but it shows two ways of getting the selected row data. Look at the edit() and delete() methods of the backing bean. The first way does it by DataModel#getRowData()and the second way does it by just passing it straight into action method using the new EL 2.2 feature.

When a user clicks the "Add to my favorites" button, the selected row is not getting passed to the backing bean, the navigation case is not being followed, and the current page is refreshed.

That will happen when the value of the <h:dataTable> isn't exactly the same as it was during the initial request wherein the page with the table is been displayed. That will in turn happen if the bean is request scoped and/or the value of the <h:dataTable> depends on a request parameter. Placing the bean in the view scope and/or making sure that you prepare exactly the same value in the (post)constructor of the bean should fix it. When using the view scope, you should remove the binding of the <h:dataTable> to the bean.

In your particular case, with navigation to a different view involved, there's perhaps another, better, way. The concrete functional requirement is not exactly clear. Is it kind of a confirmation page? Rather use GET then. Or is it just a landing page after a successful action? Rather use POST-Redirect-GET. For another hints, see also Communication in JSF 2.0 - Processing GET request parameters.