The customized book-now button shows patients the first available check-in time slot.
The book-now button consists of JSONP code that enables the website developer to embed the first available time in a button that s/he has designed. This approach allows the developer to customize that button to match the health system’s brand and to be fully mobile-responsive.
First available time:
134 Harvey Ave.
Cincinnati, OH 45229
513-555-5557
Open daily 8:00 AM - 9:00 PM
Load the jQuery library.
Mandatory: Load the jQuery script BEFORE the ER Express script.
Best practice: Load jQuery from a CDN: https://code.jquery.com/
FacilityID: We will provide the Facility ID. Please replace once you receive the ID(s).
VariableName: Customize by facility - please replace with a unique name.
We recommend putting this in the header of the online check-in landing/hub page.
<script type="text/javascript">
$ ( function() {
var FacilityBookNowVariableName = "https://apps10.erexpress.com/erx-reservationform/api/firstavailable/facilityID?callback=?"; $.getJSON(FacilityBookNowVariableName, function( data )
{
$('#FacilityBookNowTimeVariableName').html("<p style='margin-bottom: 0; line-height:10px;'> First Available Time: " + data.reservationTime + "</p>");
});
});
</script>
Put this code inside each book-now button. It will then render the 1st available time next to the 'Book Online' hypertext.
<a id="FacilityBookNowTimeVariableName" href="reservation page URL"></a>
Sample script to load jQuery here.
<script src="https://code.jquery.com/jquery-3.4.1.min.js" integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script>
After selecting the book-now button, patients should be led to a landing page on your website where the reservation form iframe has been placed. This is the actual form patients will fill out in order to check in to specific facilities.
FacilityID:
We will provide the Facility ID(s). Please replace once you receive the ID(s).
The code below will generate the reservation form. Please place this code on a separate page per facility.
<iframe class="checkin-iframe" id="ERExpressiframe" src="https://apps10.erexpress.com/erx-reservationform/home/index/facilityID"></iframe>
Insert this listener code to handle the height adjustment. It should go on each reservation page. We recommend placing it on the header of the page or some developers prefer to put this code into a separate js file, and then include the js in the page source code.
function initializeERExpressListeners() {
var eventMethod = window.addEventListener ? "addEventListener" : "attachEvent";
var eventer = window[eventMethod];
var messageEvent = eventMethod == "attachEvent" ? "onmessage" : "message";
eventer(messageEvent, function (e) {
if (e.origin.indexOf("erexpress.com") > -1) {
//console.log('received message!: ', e);
var messageArray = e.data.split('|');
if (messageArray[0] == 'CheckInSubmitted' && messageArray[1] == 'true') {
// Triggered by a check-in event
}
else {
//Call to CSS for height adjustment
$('#' + messageArray[0]).css({ 'height': messageArray[1] + 'px' });
}
}
}, false);
}
function postMessageToIframe(iframeId, message) {
var win = $('#' + iframeId)[0].contentWindow;
win.postMessage(message, "*");
}
initializeERExpressListeners();
© 2021 ER Express. All rights reserved.
