Booking Form LightBox Error/Form won't submit

Ask the community
, ,
1

I’m sure there is a simple fix, but I’m not seeing it. Can someone take a look. Maybe fresh eyes will help.

My form won’t submit. I’m getting this error: " TypeError: Cannot read property ‘form’ of undefined Line 81"

import wixWindow from "wix-window";
import wixData from 'wix-data';
import wixBookings from 'wix-bookings';
import wixPay from 'wix-pay';

let slot;
let serv;

$w.onReady(() => {
 let data = wixWindow.lightbox.getContext()
    slot = data.slot
    serv = data.serv
    $w("#servicesDataset").setFilter(wixData.filter()
        .eq("_id", serv)
    )

    $w("#bookingDataset").onReady(() => {
        $w("#bookingDataset").setFieldValue("relService", serv)
    })
})

export function bookingDataset_ready() {
 let itemData = $w("#bookingDataset").getCurrentItem()
 let serviceId = itemData._id
}

export function checkbox1_change(event) {
 let checked = $w("#checkbox1").checked
 if (checked === true) {
        $w("#button12").enable()
    } else {
        $w("#button12").disable()
    }
}

export function button12_click_1(event) {
    $w("#errText").hide()

 let name = $w("#nameInput").value
 let email = $w("#emailInput").value
 let phone = $w("#phoneInput").value
 let dogName = $w("#dogInput").value
 let aggro = $w("#aggressiveInput").value
 let vaccs = $w("#vaccinationInput").value
 let number = $w("#quantityInput").value

 if (name === '' || email === '' || phone === '' || dogName === '' || aggro === '' || vaccs === '' || number === '') {

        $w("#errText").text = "Error, Enter all data"
        $w("#errText").show()

    } else {

 let chosenSlot = slot

 let formFieldValues = [{
 "_id": "dabb877b-af3f-4a6b-8be0-821c66c9e188", // name field
 "value": name
        }, {
 "_id": "b67d5f85-e4b6-4be1-bfdd-fb33cfbaac99", // email field
 "value": email
        }, {
 "_id": "02dfda40-7e2a-472c-9859-a2ea6a1f6d3d", // phone field 
 "value": phone
        }, {
 "_id": "b67d5f85-e4b6-4be1-bfdd-fb33cfbaac99", // dog name field 
 "value": dogName
        }];

        console.log(formFieldValues)

 let bookingInfo = {
 "slot": chosenSlot,
 "formFields": formFieldValues
        };

 let options = {
 "paymentType": "wixPay_Online"
        }

        console.log(bookingInfo)                       Line 81

        wixBookings.checkoutBooking(bookingInfo)
            .then((results) => {
 let id = results.bookingId;
 let status = results.status;
                $w("#bookingDataset").setFieldValue("bookingId", id);
                $w("#bookingDataset").save();
                console.log(id)
                console.log(status)
 
            }).catch((err) => {
                console.log(err)
                $w("#errText").text = "Error placing booking. Please try again, If problem persists, contact us"
                $w("#errText").show()
            })

    }}

export function bookingDataset_afterSave() {
    wixWindow.openLightbox("thanksBooking")
}
2

Don’t know if it’s relevant, but you also need an onReady() for the #servicesDataset before you can do a setFilter().

$w("#servicesDataset").onReady(() => {
   $w("#servicesDataset").setFilter(wixData.filter() 
      .eq("_id", serv)
   )
})

If you continue to have problems, please post the URL of your site. Only authorized Wix personnel can get access to your site in the editor. Please include the name of the page involved.

3

Thanks Yisrael! Your suggestion of placing the #servicesDataset inside an onReady() fixed the issue!