Custom bookings form and applying coupon

Ask the community
, , ,
1

Hello,

I am trying to create a custom booking experience on my wix website using Velo. I managed to have a service page where clients can select the date they want and click on a button that redirects them to a new page with a form.

I have all my form fields ready. I’d like to add a text input where they can put a coupon and click on a button “Apply” that would calculate and update the price in the reservation info recap I made. (Then they can click on the “Pay” button and i think i will have to use the checkoutBooking() for this.)

I need help regarding the coupon method. I have to get the user input and see if it is one of the coupon I have created and also if it respects the condition because i’d like the user to be able to see the updated price on the reservation recap before clicking on pay .

I can see that the checkoutBooking has PaymentOptions object with a payment method and a coupon that can be passed. This would be after the user has clicked on pay. I also assume i’d have to test if the coupon exists anyway ? I haven’t tested the checkoutBooking yet so i’m not sure how it’s working.

I found there is a applyCoupon in the wix-stores documentation but it seems like it’s to apply a coupon on a cart, however using wix bookings, there is not a cart so I think this is not the solution.

Is there another way I could access my website coupon using velo so I could check if the coupon applied can be used on the user reservation and update the displayed price before the payment process?

Is there a better or more correct way to achieve this ? I’m putting a screen capture to try and explain what I’d like to do.

Thank you for any help and advice :slight_smile:

939×631 53.7 KB

2

Hi @kelly-deliciousorigi ,
It’s Jacob from Wix Bookings.
Coupon information is available for all in the Marketing/Coupons collection.
You can query that collection for the desired coupon with this function.
Run from backend as this function contains suppressAuth param and should be used wisely.
2. This function returns the an object with partial data of the coupon object. This info should be sufficient for re-calculating the price in prontend.

import wixData from 'wix-data';

export async function getCoupon(couponCode) {
    return wixData.query("Marketing/Coupons")
    .find({suppressAuth: true})
    .then( (results) => {
        let foundCoupon = results.items.find(item => item.code === couponCode)
        console.log("foundCoupon is:", foundCoupon);
        if (foundCoupon) {
            return {
                moneyOffAmount: foundCoupon.moneyOffAmount ? foundCoupon.moneyOffAmount : "undefined",
                percentOffRate: foundCoupon.percentOffRate ? foundCoupon.percentOffRate : "undefined",
                canBeApplied:        !foundCoupon.expired && foundCoupon.valid
            }
        } else {
            return {}
        }
    }) ;
}

Then, you get canBeApplied=true, in the frontend, you can recalculate the price you show to your customers and pass the couponCode parameter as shown in checkoutBookings() API, under Book a service with payment options. Once you pass the couponCode, the price will be adjusted according to coupon policy.

3

Hey, how did you deleted mandatory fields in Booking forms? I cannot for example delete Address from field, the is no option - only edit.