createOnlineOrder( )
Orders a pricing plan.
Description
The createOnlineOrder()
function returns a Promise that resolves to an Order
object.
To process pricing plans on your site, first set up your site to offer pricing plans as described in About Pricing Plans. When setting up your site to accept pricing plans, define the plans you want to offer.
Ordering a plan places an order for the plan, without actually purchasing it. You can then continue the payment process with Wix Pay, which applies the plan to the buyer on completion of payment.
To understand how createOnlineOrder()
is used in a customized pricing plan lifecycle,
see Customized Pricing Plan Purchases.
Notes:
The pricing plan
createOnlineOrder()
andcreateOfflineOrder()
functions replace the deprecated paid plansorderPlan()
function. The deprecated function will continue to work, but will not receive updates. To keep any existing code compatible with future changes, see theorderPlan()
migration instructions.To work with the Pricing Plans API, you need to publish your site.
Syntax
function createOnlineOrder(planId: string, [options: CreateOnlineOrderOptions]): Promise<Order>
createOnlineOrder Parameters
NAME
TYPE
DESCRIPTION
The plan ID.
Additional options for creating the online order.
Returns
Fulfilled - The created order.
Return Type:
NAME
TYPE
DESCRIPTION
Order ID.
ID of the plan that was ordered.
ID of the related Wix subscription.
Every pricing plan order corresponds to a Wix subscription, including orders for single payment plans. You can see all orders from your site's Subscriptions page in the Dashboard.
ID of the associated Wix Pay order.
Created by the createOnlineOrder()
or createfflineOrder()
function. For online orders, send this value as a parameter to the Wix Pay startPayment()
function to enable your buyer to pay for the order. wixPayOrderId
is omitted if the order is free.
The buyer's IDs. Includes memberId
and contactId
.
Currently, Pricing Plan orders are limited to members only. contactId
is returned, but a buyer will not be able to order a plan without a memberId
.
Deprecated. Use pricing
instead.
How the order was processed. Supported values:
"ONLINE"
. The buyer ordered the plan using the site."OFFLINE"
. The buyer made a manual, offline order without using the site.
Status of the order. Supported values:
"DRAFT"
. The order has been initiated but payment hasn't been processed yet. The plan isn't yet available for use."PENDING"
. The order has been processed and its start date is set in the future. The plan isn't yet available for use."ACTIVE"
. The order has been processed. The plan is available for use."PAUSED"
. The order, and use of the plan, is paused. For example, if the buyer is away. The order, and use of the plan, can be resumed."ENDED"
. The order has completed its duration and is no longer available for use."CANCELED"
. The order has been canceled.
Whether the order will be canceled at the next payment date.
If true
, the order status
will be CANCELED
and the next payment won't be charged. Omitted for single payment orders.
Details about the cancellation of an order. Only present if the status
is "CANCELED"
.
Status of the last payment for the order. This is updated automatically for online orders. The site owner updates this manually for offline orders. Supported values:
"PAID"
. The last payment was paid."REFUNDED"
. The last payment was refunded."FAILED"
. The last payment transaction didn't complete."UNPAID"
. The last payment wasn't paid."PENDING"
. Awaiting payment."NOT_APPLICABLE"
. No payment was necessary. For example, for free plans or free trials.
Start date and time for the ordered plan.
List of periods during which this order is paused.
Free trial period, in days. Only available for recurring plans.
Earliest end date and time that the plan for this order can expire.
This is calculated by adding all pause periods to the original end date. Omitted if the order is active until canceled. Reserved for future use.
Current payment cycle for the order.
currentCycle
will be omitted if the order's status is CANCELED
or ENDED
, or if the startDate
hasn't passed yet.
Name of the plan at the time of the order.
Description of the plan at the time of the order.
Plan price as it was at the moment of order creation.
Date and time the order was created.
Date and time the order was last updated. For example, the date and time an order was paused, resumed, or canceled.
Was this helpful?
1import { checkout } from 'wix-pricing-plans-frontend';23// Sample planId value: '099e2c86-3b7e-4477-8c27-f77402b8cced'45$w.onReady(function () {6 $w('#myOrderButton').onClick((event) => {7 checkout.createOnlineOrder(planId)8 .then((order) => {9 const id = order._id;10 const status = order.status;1112 console.log('Success! Created order:', order);13 return order;14 })15 .catch((error) => {16 console.error(error);17 })18 });19});2021/* Promise resolves to:22 * {23 * "_id": "ec66a557-5f23-4b71-91c5-6ea98a694537",24 * "planId": "099e2c86-3b7e-4477-8c27-f77402b8cceb",25 * "subscriptionId": "6f61e080-be4a-4859-a49e-b44b5da87129",26 * "wixPayOrderId": "d7c01c4b-c04d-4ebe-bd66-3973fa1fdb53",27 * "buyer": {28 * "memberId": "0c9bca47-1f00-4b92-af1c-7852452e949a",29 * "contactId": "0c9bca47-1f00-4b92-af1c-7852452e949a"30 * },31 * "priceDetails": {32 * "subtotal": "74.99",33 * "discount": "0",34 * "total": "74.99",35 * "planPrice": "74.99",36 * "currency": "EUR",37 * "subscription": {38 * "cycleDuration": {39 * "count": 1,40 * "unit": "MONTH"41 * },42 * "cycleCount": 343 * }44 * },45 * "pricing": {46 * "subscription": {47 * "cycleDuration": {48 * "count": 1,49 * "unit": "MONTH"50 * },51 * "cycleCount": 352 * },53 * "prices": [54 * {55 * "duration": {56 * "cycleFrom": 1,57 * "numberOfCycles": 358 * },59 * "price": {60 * "subtotal": "74.99",61 * "discount": "0",62 * "total": "74.99",63 * "currency": "EUR"64 * }65 * }]66 * },67 * "type": "ONLINE",68 * "orderMethod": "UNKNOWN",69 * "status": "DRAFT",70 * "autoRenewCanceled": false,71 * "lastPaymentStatus": "UNPAID",72 * "startDate": "2022-08-22T19:51:36.470Z",73 * "endDate": "2022-11-22T19:51:36.470Z",74 * "pausePeriods": [],75 * "earliestEndDate": "2022-11-22T19:51:36.470Z",76 * "currentCycle": {77 * "index": 1,78 * "startedDate": "2022-08-22T19:51:36.470Z",79 * "endedDate": "2022-09-22T19:51:36.470Z"80 * },81 * "planName": "Platinum Pro",82 * "planDescription": "",83 * "planPrice": "74.99",84 * "_createdDate": "2022-08-22T19:51:36.470Z",85 * "_updatedDate": "2022-08-22T19:51:36.470Z"86 * }87 */
This example demonstrates a customized pricing plans scenario for ordering plans.
Note: In the interest of simplicity the code does not deal with display considerations or validations that would normally be required to make sure users perform the flow as intended.
The customization includes:
- 2 dynamic pages, connected to the Plans collection:
- A plan viewer page for viewing all plans.
- A single-plan page for viewing a selected plan.
- 1 lightbox for confirming the order.
The plan viewer page has the following elements:
- planDataset: Connects the page to the Plans collection.
- planRepeater: Displays fields for each plan.
- viewButton: When clicked, displays the single-plan page for the selected plan.
The single-plan page has the following elements:
- dynamicDataset: Connects the page to the Plans collection.
- planName: Text element that displays the plan's name.
- planDescription: Text element that displays the plan's tagline.
- orderPlanButton: Performs a request to order the plan.
The orderCreated customized lightbox has the following elements:
- orderData: The details of the order and its corresponding plan.
- buyButton: A customized button that, when clicked, starts payment processing.
- closeButton: A customized button that, when clicked, closes the lightbox.
This example assumes that:
- The "Automatically display lightbox on pages" toggle is off.
- All options for "How does this lightbox close?" are toggled off.
1/****************************************2 * Code on a plan viewer dynamic page *3 ****************************************/45// For navigating to a dynamic page:6import wixLocationFrontend from 'wix-location-frontend';78$w.onReady( function () {9 $w('#viewButton').onClick((event) => {10 let $item = $w.at(event.context);11 let clickedItem = $item('#planDataset').getCurrentItem();12 let slug = clickedItem.slug;13 wixLocationFrontend.to('/plans/' + slug);14 });15});1617/****************************************18 * Lightbox code *19 ****************************************/2021// For working with a lightbox:22import wixWindowFrontend from 'wix-window-frontend';2324$w.onReady(function () {25 const receivedData = wixWindowFrontend.lightbox.getContext();26 $w('#orderData').text = receivedData;27});2829// This code assumes that the closeButton_click30// event handler was added using the "Properties31// & Events" panel. Make sure to do the same if you32// copy this code.33//34// Note that the "Close" button was created35// using standard elements. It was not added36// using Lightbox Settings.3738export function closeButton_click(event) {39 wixWindowFrontend.lightbox.close();40};4142/****************************************43 * Code on a single-plan dynamic page *44 ****************************************/4546// For working with a lightbox:47import wixWindowFrontend from 'wix-window-frontend';4849import { checkout } from 'wix-pricing-plans-frontend';5051$w.onReady(function () {52 $w('#dynamicDataset').onReady( () => {53 const currentPlanObject = $w('#dynamicDataset').getCurrentItem();54 const planId = currentPlanObject._id;55 $w('#planName').text = currentPlanObject.name;56 $w('#planDescription').text = currentPlanObject.description;5758 $w('orderPlanButton').onClick((event) => {59 const order = checkout.createOnlineOrder(planId)60 .then((order) => {61 const planWithOrder = {62 plan: currentPlanObject,63 order: order64 };65 wixWindowFrontend.openLightbox('orderCreated', planWithOrder);66 });67 });68 });69});70