Handling modal boxes

• Opening a modal box with the invoke method
• Opening an alert box with the invoke method
• Closing a modal box with the invoke method
• Resizing a modal box with the invoke method
• Closing an attachment picker with the invoke method
• instance
• emit
• on

Opening a modal box with the invoke method

Creates a new iframe instance of the extension in the specified location.

zohobugtracker.invoke("modal.create",modal_location);

A widget ID and a string constant are generated as the output.

Opening an alert box with the invoke method

Pops up an alert box with the data passed in the function.

zohobugtracker.invoke("alert",{type:"success", data:"Permission granted successfully!"});

Closing a modal box with the invoke method

Closes an iframe instance of the extension that was already opened in the specified location.

zohobugtracker.invoke("modal.close",modalInfo.widgetID);

Resizing a modal box with the invoke method

Resizes the iframe instance of the extension to the specified size.

zohobugtracker.invoke("modal.resize", resize_modal);

A widget ID and a string constant are generated as the output.

Sample code and response

var modal_location_html={"url":"/app/choosefiles.html"};
var resize_modal={"width" : 600,"height" : 400};
zohobugtracker.invoke("modal.create","modal_location_html").then(function(modalInfo){
console.log(modalInfo);
/*
{
  "url": "/app/choosefiles.html",
  "location": "__MODAL__",
  "widgetID": "3f9f2d2b-22df-4266-8681-fa75fd01c7ba"
}
*/
zohobugtracker.invoke("modal.close",modalInfo.widgetID).then(function(response)
​/*
{console.log(response);
/*Output
Modal closed
*/
});
});
zohobugtracker.invoke("modal.resize", resize_modal).then(function(response){
                    console.log(response);
                });
/*Output : 
Modal is resized to 400px height and 600px width
​*/
​);

Closing an attachment picker with the invoke method

Closes an iframe instance of the extension that was opened in the specified location to attach a file.

zohobugtracker.invoke("attachment_picker.close");

instance

Creates an instance for a specific widget.

zohobugtracker.instance(widget_ID);

emit

Throws data from the current location.

zohobugtracker.emit("KeyforMyListener", data);

on

Listens or receives data from the emit method.

zohobugtracker.on("KeyforMyListener", data);

Assume the following sample code block is called from a parent file '/apps/index.html' and '/apps/file.html' is the child file.

var modal_location={"url":"/apps/file.html"};
zohobugtracker.invoke("modal.create",modal_location).then(function(modalInfo){
var modalInstance=zohobugtracker.instance(modalInfo.widgetID);
modalInstance.on("modal.opened", function(){ /* This code listens for the status 'modal.opened' from the child HTML - file.html */
var data = {org: "1234"};
modalInstance.emit("submit", data);
});/* This code throws a status 'submit' along with an object to the child HTML - file.html*/
modalInstance.on("submitted",function(data){ 
/*This code listens for a status with the key 'submitted' from the child HTML*/
zohobugtracker.invoke("modal.close", modalInfo.widgetID);
});

Assume the following sample code block is called from the child file '/apps/file.html' and '/apps/index.html' is the parent file.

var filedetails = {"filename": "abc"};
zohobugtracker.on("submit", function (data) {});
/*This code listens for an event with the key "submit" from the parent file index.html  */
zohobugtracker.emit("submitted", filedetails); 
/* This code throws a status 'submitted' along with an object to the parent file index.html */