Showing Remaining Capacity on the Product Page

BookThatApp can notify you the available capacity when a date/time is chosen.

Set it up in the booking-form snippet:

<script type="text/javascript">
var bta = {
    product_id: {{ product.id }}
};
  
// called when a date or time is chosen - use this to grab the availability info
$('form[action="/cart/add"]').on('bta.datetimeChange', function(event, form) {
  $('#available').text(form.getAvailability() + " spaces available");
});
</script>

For further details please see the developer guide, under the product page section.