How to add a button that pre-fills a meeting location in the booking form

Modified on Tue, 5 May at 11:24 AM

How to add a button that pre-fills a meeting location in the booking form

Give customers a one-click shortcut to book at your office, showroom, or any fixed meeting point. A button fills the address field automatically — no typing, no DAWA search needed.

TL;DR

Create a button with onclick="selectOfficeLocation()". The JS function calls $('.dawa-address').val('your address').trigger('blur') and shows #location_div. Place the code in Form Part 1 or an HTML component for reuse.

Get started in 3 steps

Open your booking form and go to Form Part 1 (or create/edit an HTML component for reuse across forms).

Paste the button and script below. Replace the address string with your own. Optionally set extra field values (e.g. toggle a phone-meeting flag):

<button type="button" onclick="selectOfficeLocation()"
        class="btn btn-success"
        style="background-color: #1D5FED; border-color: #1D5FED;">
    Book meeting at our office
</button>

<script>
function selectOfficeLocation() {
    $('.dawa-address')
        .val('Vesterbrogade 39, 1., 1620 København V')
        .trigger('blur');

    var locationDiv = document.getElementById('location_div');
    if (locationDiv) {
        locationDiv.style.display = 'block';
    }

    // Optional: set an extra field
    $('#telefonmoede').val('0');
}
</script>

Save and test. Click the button on the public form and confirm the address field is filled and the location block is visible.

HTML component: use <hh-html.office-booking-button /> to embed across multiple forms · Multiple locations: duplicate the button and function with different addresses