views:

27

answers:

1

I'm trying to display a shopping cart in my application (Seam/RichFaces), and have included a "remove from cart" <a4j:commandLink /> next to each item to remove the item from the cart. When I click the link it is supposed to rerender the cart contents to show that the item has been removed. However, when I click the link, nothing happens. The cart is backed by an ArrayList in my action that contains the items. I can see the call in my action, so I know the item has been removed -- and, if I refresh the page I see it has been removed. Am I doing something wrong in my code below that is causing this section of the page not to rerender properly?

UPDATE: It seems as though it will rerender properly, but not in all circumstances. If I've got more than 1 item in my cart and remove any item but the most recently added item it rerenders properly. If I only have one item in the cart, or I try and remove the most recently added item, it fails to rerender anything. Any thoughts on what's going on here??

<s:div styleClass="cart_bag" rendered="#{identity.loggedIn}">
        <h6 class="head"><h:outputText value="Your Shopping Cart" /><a:status
            forceId="true" id="shoppingCartStatus">
            <f:facet name="start">
                <h:graphicImage value="/images/ajax-loader.gif" styleClass="right" />
            </f:facet>
        </a:status></h6>
        <s:div id="shoppingCartItems">
            <s:fragment
                rendered="#{shoppingCart.shoppingCartContents.size() le 0}">
                <p><s:span styleClass="bold">
                    <h:outputText style="color: #FFF;"
                        value="Your shopping cart is empty" />
                    <br />
                    <br />
                    <br />
                </s:span></p>
            </s:fragment>
            <s:fragment
                rendered="#{shoppingCart.shoppingCartContents.size() gt 0}">
                <h:form>
                    <ul>
                        <ui:repeat value="#{shoppingCart.shoppingCartContents}"
                            var="cartItem">
                            <li><s:div styleClass="thumb">
                                <a href="detail.html"><img src="../images/cart_thumb.gif"
                                    alt="" /></a>
                            </s:div> <s:div styleClass="desc">
                                <s:link view="/index.xhtml" styleClass="bold"
                                    value="#{cartItem.name}">
                                    <f:param name="ctxid" value="#{cartItem.uniqueIdentifier}" />
                                </s:link>
                                <p><span class="bold">Unit Price:</span> $629</p>
                            </s:div><a:commandLink id="removeItemFromCartBtn"
                                action="#{shoppingCart.removeFromShoppingCart()}"
                                styleClass="cros" reRender="shoppingCartItems"
                                status="shoppingCartStatus">
                                <f:param name="ctxid" value="#{cartItem.uniqueIdentifier}" />
                                <h:graphicImage value="/images/remove.png" />
                            </a:commandLink></li>
                        </ui:repeat>
                    </ul>
                </h:form>
            </s:fragment>
        </s:div>
        <s:div styleClass="clear"></s:div>
        <s:fragment
            rendered="#{shoppingCart.shoppingCartContents.size() gt 0}">
            <p class="total left bold"><h:outputText
                value="Total:  #{shoppingCart.shoppingCartTotal}" /></p>
            <a href="cart.html" class="crtbtn right"><span>Checkout</span></a>
        </s:fragment>
    </s:div>
A: 

Solved. I wrapped the offending JSF code in a <a4j:outputPanel ajaxRendered="true" /> and everything began working as expected.

Shadowman