At work I’ve come t resolve a necessity which was in a payment screen updating a price panel component right after customers fires the promotion button to apply a price deduction which is controlled and price update is applied from the back bean. the panel you see on the right hand side will be affected
Before Update
After Update
Frontend
<h:form id="primeForm" styleClass="default-form">
<!-- Package Panel begin -->
<p:panel header="#{msg.membership_details_confirmation}"
widgetVar="packageVar" styleClass="cart animation2" id="package">
<p:outputPanel id="packageInfo" styleClass="detail-departments">
<h:outputText styleClass="staticText"
value="#{msg.membership_details_you_selected}" />
<h:outputText styleClass="staticText"
value="#{msg.member_club_name}" />
<h:outputText styleClass="selectedClub"
value="#{memberController.order.club.name}" />
<hr />
<h:outputText styleClass="staticText" value="#{msg.membership}" />
<h:outputText styleClass="selectedClub"
value="#{memberController.order.membership.localizedDescription}" />
<div style="clear: both" />
<div class="membershipDescrition">
<h:outputText styleClass="staticText"
style="padding-top: 10px; font-weight: bold !important;"
value="#{memberController.order.membership.type == 'MONTHLY' ? msg.monthly : msg.yearly} #{msg.member_charges}" />
<h:outputText styleClass="selectedUnit"
value="#{memberController.order.membership.type == 'MONTHLY' ? memberController.calculatedPrice.additionalPrice : memberController.calculatedPrice.totalPriceWithAdditional} #{memberController.order.membership.type == 'MONTHLY' ? msg.payment_monthly_pay : msg.payment_tl} " />
<div style="width: 80%; display: inline-block; margin-top: 10px;"
class="packageInfoColumn">
<h:outputText styleClass="tc-message"
value="#{msg.member_as_follows}" />
</div>
<div style="width: 55%; display: inline-block"
class="packageInfoColumn">1- #{msg.membership_joining_fee}</div>
<div style="display: inline-block" class="packagePrice">#{memberController.calculatedPrice.enrollmentPrice}
#{msg.payment_tl}</div>
<!-- Non presale club -->
<h:panelGroup
rendered="#{memberController.calculatedPrice.preSaleClub == false}">
<div style="width: 55%; display: inline-block"
class="packageInfoColumn">2- #{msg.member_prorated}</div>
<div style="display: inline-block" class="packagePrice">#{memberController.calculatedPrice.currentMonthPrice}
#{msg.payment_tl}</div>
</h:panelGroup>
<!-- Presale club -->
<h:panelGroup
rendered="#{memberController.calculatedPrice.preSaleClub == true}">
<div style="width: 55%; display: inline-block"
class="packageInfoColumn">
2-
<h:outputText
value="#{memberController.order.membership.type == 'MONTHLY' ? msg.member_monthly_charge : msg.member_annual_charge}" />
</div>
<div style="display: inline-block" class="packagePrice">#{memberController.calculatedPrice.grandTotal}
#{msg.payment_tl}</div>
</h:panelGroup>
<!-- Monthly -->
<h:panelGroup
rendered="#{memberController.order.membership.type == 'MONTHLY' and memberController.calculatedPrice.additionalPriceVisible == true} ">
<div style="width: 55%; display: inline-block"
class="packageInfoColumn">3-
#{msg.member_additionaly_monthly}</div>
<div style="display: inline-block" class="packagePrice">#{memberController.calculatedPrice.additionalPrice}
#{msg.payment_tl}</div>
</h:panelGroup>
<!-- Annually -->
<h:panelGroup
rendered="#{memberController.order.membership.type == 'YEARLY' and memberController.calculatedPrice.totalPrice != null and memberController.calculatedPrice.preSaleClub == false}">
<div style="width: 55%; display: inline-block"
class="packageInfoColumn">3-
#{msg.member_additionaly_yearly}</div>
<div style="display: inline-block" class="packagePrice">#{memberController.calculatedPrice.totalPrice}
#{msg.payment_tl}</div>
</h:panelGroup>
<p:outputPanel styleClass="packageInfoRow">
<div
style="width: 55%; display: inline-block; font-weight: bold !important;"
class="packageInfoColumn">#{msg.member_total_currenly_charges}
</div>
<div style="display: inline-block" class="packagePrice">
<h:outputText styleClass="entranceFee"
value="#{memberController.calculatedPrice.grandTotal} #{msg.payment_tl}" />
</div>
</p:outputPanel>
<p:outputPanel styleClass="packageInfoRow"
style="margin-bottom: 50px;">
<div style="display: inline-block; margin-top: 10px;"
class="packageInfoColumn">
<h:outputText styleClass="tc-message"
value="#{memberController.order.membership.type == 'MONTHLY' ? msg.member_package_monthly_message : ''} " />
</div>
</p:outputPanel>
<p:commandButton value="#{msg.con}" update="primeForm"
styleClass="green-button"
action="#{memberController.saveAndContinue()}"
icon="ui-icon-check" />
</div>
</p:outputPanel>
</h:form>
Back bean
public void addPromotionCode() {
if (promotionCode != null) {
LOG.info("validating the promotion code : " + promotionCode);
BLPriceResponse blPriceResponse = callPricingService(promotionCode);
if (blPriceResponse.isResponse()) {
LOG.info("valid promotion code : " + promotionCode);
// apply the code to the session info
sessionInformation.setPriceResponse(blPriceResponse);
// recalculate the price
calculatePrice();
// update the form
RequestContext.getCurrentInstance().update("primeForm:package");
LOG.info("calculated price : " + calculatedPrice.toString());
} else {
LOG.info("invalid promotion code : " + promotionCode);
// the code does not work paint it to red
MessageUtil.addMessage("primeForm:promotionCode", FacesMessage.SEVERITY_ERROR,
OLSConstants.PROMOTION_CODE_NOT_VALID, OLSConstants.PROMOTION_CODE_NOT_VALID);
promotionCode = null;
RequestContext.getCurrentInstance().execute("addError('pCodeVar')");
}
}
}
Explanation
here in this situation we have defined the form an id called “primeForm” and the component whose complete values will be refreshed is defined in between this form tag with the id called “package”. In the controller where the method invoked “addPromotionCode” particularly check the promotion code, if the code is accurate then in the method “calculatePrice” the regarding bean is updated. Then by invoking update method on the requst context interface, we first reach out the first element, then with the colon we delimiter and reach out to the child element “package” which will be affected.