# 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      |
| <p>1 (with or without UI showing)<br><strong>Note</strong>: The <code>drb2b\_orderSummary</code> component will trigger an event to show the <code>drb2b\_placeOrder</code> component. Also <code>drb2b\_placeOrder</code> component uses logic to place an order which is inside the <code>drb2b\_orderSummary</code> component, so you need to configure one <code>drb2b\_orderSummary</code> component in the subflow to use the <code>drb2b\_placeOrder</code> component on the Checkout page.</p> | 1+                                                      | Yes      |
| <p>1<br><strong>Note</strong>: The <code>drb2b\_orderSummary</code> component can remain hidden by setting the <a href="../designer-attributes">Show All designer attribute</a> to <code>false</code>.</p>                                                                                                                                                                                                                                                                                             | 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.

{% code title="Import example" %}

```
import dr_lms from "@salesforce/messageChannel/digitalriverv3__DigitalRiverMessageChannel__c";

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

```

{% endcode %}

Declare the message context variable as shown below.

{% code title="Declare variable example" %}

```
@wire(MessageContext) messageContext;
```

{% endcode %}

Publish the event.

{% code title="Event publishing example" %}

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

```

{% endcode %}

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 |
