Place order component

Learn how to use the place order component.

Use drb2b_placeOrder component to add the Place Order button on the Checkout page in Experience Builder. For the Place Order button to appear, you must use the Place Order component with the rb2b_orderSummary component in the flow on the Place Order page. When using the drb2b_placeOrder component, note the following considerations:

Number of drb2b_orderSummary components in the subflow
Number of drb2b_placeOrder components on Checkout page
Allowed?

1

1+

Yes

>1

1+

No

1+

0

Yes

1 (with or without UI showing) Note: The drb2b_orderSummary component will trigger an event to show the drb2b_placeOrder component. Also drb2b_placeOrder component uses logic to place an order which is inside the drb2b_orderSummary component, so you need to configure one drb2b_orderSummary component in the subflow to use the drb2b_placeOrder component on the Checkout page.

1+

Yes

1 Note: The drb2b_orderSummary component can remain hidden by setting the Show All designer attribute to false.

1

Yes

0

1+

No

Alternatively, you can place a Place Order component inside a flow or subflow. You should use the the above considerations if you choose this option.

Publish the Place order component events

Complete the following tasks to publish various event types. The event purpose and payload will vary depending on the use case.

Import DigitalRiverMessageChannel__c message channel and message service into a custom JavaScript file as shown below.

Import example
import dr_lms from "@salesforce/messageChannel/digitalriverv3__DigitalRiverMessageChannel__c";

import {publish, MessageContext } from "lightning/messageService";

Declare the message context variable as shown below.

Declare variable example
@wire(MessageContext) messageContext;

Publish the event.

Event publishing example
publish(this.messageContext, dr_lms, { 
                    purpose: '<purpose>',           
                    payload: '<payload>'            
                });

Refer to the following table for more information on the Place order component events.

Event Purpose
Event payload example
Description

toggleShowPOComponent

{"isShow":true}

Publish this event to show {"isShow":true} or hide {"isShow":false} the Place Order component

Last updated