CADViewer Technical Documentation, Installation Guide and Reference Samples Library

Call-Back Dynamic Modals for Highlight

The section Custom Modals for Highlight/CAFM describes in detail on how to set up user defined pop-up modals when interacting with an object space in the floor-plan for intelligent highlight. However, these modals are static in nature, they contains header information on the object clicked and the type of object, but the content of the modal itself keeps the original configuration.

CADViewer, also allows application programmers the ability to catch a call-back when an object is clicked, and dynamically set the content of the popup modal. This allows application programmers to interact with a database or back-end and serve object specific content back to the CADViewer canvas.

Please read the section Custom Modals for Highlight/CAFM on the base set-up of modals.

To define a call-back initialize CADViewer with a call to the method cvjs_setCallbackForModalDisplay() to which two parameters myCustomPopUpBody and populateMyCustomPopUpBody in the call are methods that needs to be implemented seperately in the code.

Click on the method to open the API documentation.

A sample template implementation of myCustomPopUpBody and populateMyCustomPopUpBody is per below, myCustomPopUpBody contains the modal html template that is inserted at time of activation, populateMyCustomPopUpBody does the appropriate data lock up and population of the modal.

Note: Each of the id’s in the pop-up modal for css accesibility, needs to be unique, adding the object callback ID as part of the html id= structure will do the trick.

Sample implementing dynamic PopUp Modals

Please refere to our Online sample and Sample Documentation for an sample implementing Dynamic PopUp Modals.

Last updated on 11 May 2020
Published on 11 May 2020