Code Page ERX10 | ER Express

First Available Time JSONP Code

Reservation Form IFRAME Code

First Available Time JSONP Code

What is it?

The customized book-now button shows patients the first available check-in time slot.

How does it work?

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.

See an example

Milford Urgent Care

First available time:

See more times

Save My Spot

134 Harvey Ave.

Cincinnati, OH 45229

513-555-5557

Open daily 8:00 AM - 9:00 PM

Set it up

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.

Part 1 - Call first available time

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>

Part 2 - Render first available time

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>

Optional

Sample script to load jQuery here.

<script
src="https://code.jquery.com/jquery-3.4.1.min.js" integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script>

Reservation Form IFRAME Code

What is it?

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.

See an example

Set it up

FacilityID:
We will provide the Facility ID(s). Please replace once you receive the ID(s).

Insert Form on Page

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>

Optional - Insert dynamic height adjustment

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();