In this discussion, we provide a free solution for businesses looking to transform their site access management. This particular form is based on a mining industry use case.



This solution provides:

  • A mobile compatible form (web page) with the ability to enter visitor details.

Assumptions:

  • Your business has a registered instance with a valid license.

  • An API token has been generated to authenticate guests assigned to a Security Role with 'PersonProfileList' and 'TicketCreate' permissions.

  • Your business has a site key for Google reCAPTCHA allowing our hosting domain.

  • A Service Offer exists catering for 'Site Access Request' under a 'Site Access Management' process.

  • Site hours are 08:00 to 18:00.

  • Ongoing site access must be renewed every 3 months.

  • Form data is placed entirely into the Description rather than seperate fields.

Instructions:

  1. Download the ZIP file attached to this discussion. It contains code you can copy into a new web style and web page.

  2. After signing into eservicemanager as an Administrator, click on the left menu, then select Administration, Designer Toolbox, Web Styles, then click the Add button.

  3. Provide a name for your new web style, for example 'Site Access', and ensure Public is checked.

  4. Click Save when you have entered all your web style details.

  5. Click Edit CSS to the right of the web style you just created. Open the downloaded file with the CSS extension and copy the contents into the provided editor, then click Save.

  6. Click on the left menu, then select Administration, Designer Toolbox, Web Pages, then click the Add button.

  7. Provide a name for your new web page, for example 'Site Access', ensure Public and OOTB Includes are checked, and the Web Style is populated with the name you provided in step 3.

  8. Click Save when you have entered all your web page details.

  9. Click Edit Page to the right of the web page you just created. When the web page editor opens, click on the Import button on the toolbar. Open the downloaded file with the HTML extension and copy the contents into the provided editor.

  10. In the HTML code, find and replace the following 2 blocks of code marked with valid ID numbers from your system:

    Block 1 (Google reCAPTCHA)
    ...'sitekey' : X,...

    Block 2 (API POST Event)
    ...$.ajax({
        url: "../../api/v1/postticket?token=" + localStorage.getItem("esm-token"),
        type: "POST",
        data: JSON.stringify({
           "ref": 0,
           "cboPerson": localStorage.getItem("esm-id"),
           "cboOrganisation": localStorage.getItem("esm-organisation-id"),
           "cboLocation": localStorage.getItem("esm-location-id"),
           "cboSource": X,
           "cboServiceOffer": X,
           "cboServiceType": X,
           "txtQuantity": 1,
           "cboBusinessProcess": X,
           "clientTimezoneOffset": d.getTimezoneOffset(),
           "dateImpStart": $("#siteStartDate").val(),
           "timeImpStart": '08:00',
           "dateImpEnd": $("#siteEndDate").val(),
           "timeImpEnd": '18:00',
           "txtTitle": "Site Access - " + $("#workerName").val(),
           "txtDescription": description,
           "cboAssignToSupportGroup": X,
           "cboTicketStatus": X
        }),
    ...
     
  11. Click the Import button when you're ready. The web page should populate and display the pre-coded form. Click the Save button on the toolbar.

  12. Back in the Web Pages tab, click on the Share button against the new web page you just created. This will provide a unique URL to the web page. Try opening the link into a new browser window. Take note of the page name that is allocated to use later on.

    https://www.eservicemanager.com.au/saas/page/mybusiness/pagename?token=X

    mybusiness=your division name
    pagename=your web page name
    X=your API token

  13. It is recommended you create a workflow for the Service Offer you specify in your code.

    If tasks need to be conditional based on the form input:

    a) Create conditional fields in a new Screen, then assign the Screen to the Service Offer.
    b) In the above code from block 2, insert the custom field names and form values you require.

    We'll leave the rest up to your imagination.

    Your site access request form is ready to go!