All Collections
Technical Documentation
The booking widget
Listening for successful booking and parsing data from a standard booking widget
Listening for successful booking and parsing data from a standard booking widget

On a successful booking, data is passed back using postMessage.

Jubrine Fortuno avatar
Written by Jubrine Fortuno
Updated over a week ago

First we create a function to parse the incoming data

var receiveMessage = function(event){
    var data = event.data;
    var eventName = data.substring(0,data.indexOf('.'));
    var booking = data.substring(data.indexOf('.')+1);

    if(eventName === 'appointeddBookingConfirmed'){
        try{
            var bookingObject = JSON.parse(booking);
            console.log(bookingObject);
        }
        catch(err){
            console.warn('Failed getting JSON from event ' +
eventName, err);
            console.warn(booking);
        }
    }
};

Now we need to listen for a message being posted and handle it with the parser we created

window.addEventListener("message", receiveMessage, false);		

Now on successful bookings you should have the booking object available - you can do what you like with this. It will be in the following format:

{
    "organisation_id": "553a61aa40bde04159d63af1",
    "created_source": "bookingapp",
    "service": "Full day service",
    "service_id": "564cb46cdda1ddf79fd63af1",
    "bookable": "Chuck Norris",
    "bookable_id": "553a727340bde0de6fd63aff",
    "start_time": "2016-03-02T00:00:00+00:00",
    "end_time": "2016-03-03T00:00:00+00:00",
    "timezone": "Europe/London",
    "notes": "These are some example notes",
    "customer": {
        "profile": {
            "firstname": "Carl",
            "lastname": "Sagan",
            "email": "carl@sagan.com",
            "phone": "07777777772"
        },
    },
    "category": "Test Services",
    "organisation": "Testing emporium"
}


If you have any feedback we would love to hear it 👂

Did this answer your question?