Welcome to Portal

?Unknown\pull-down

Welcome to Zoho Cares

Bienvenido a Soporte de Zoho

Search our knowledge base, ask the community or submit a request.

Handling modal boxes

Opening a modal box with the invoke method

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


zohoprojects.invoke("modal.create",modal_location);
Argument NameData TypeDescription
actionstring"modal.create" - creates or opens a modal box.
modal_locationObjectThe relative path of the HTML file that has to be invoked. Example: {"url":"/app/choosefiles.html"};

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

Closing a modal box with the invoke method

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


zohoprojects.invoke("modal.close",modalInfo.widgetID);
Argument NameData TypeDescription
actionstring"modal.close" - closes the opened modal box.
widgetIDObjectThe widgetID generated as the output for "modal.create" should be passed here.

Resizing a modal box with the invoke method

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

zohoprojects.invoke("modal.resize", resize_modal);
Argument NameData TypeDescription
actionstring"modal.resize" - increases the default size of a modal box.
resize_modalObjectThe relative path of the HTML file that has to be invoked. Example:{"width" : 600,"height" : 400};
Min & Max allowed height 380px & 450 px.
Min & Max allowed width 550px & 950 px.

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

Closing an attachement picker with the invoke method

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


zohoprojects.invoke("attachment_picker.close");

instance

Creates an instance for a specific widget.



zohoprojects.instance(widget_ID);

Argument NameData TypeDescription
IDstringWidget ID generated from the invoke method.

emit

Throws data from the current location.



zohoprojects.emit("KeyforMyListener", data);

on

Listens or receives data from the emit method.



zohoprojects.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"};
zohoprojects.invoke("modal.create",modal_location).then(function(modalInfo){
var modalInstance=zohoprojects.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*/
zohoprojects.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"};
zohoprojects.on("submit", function (data) {});
/*This code listens for an event with the key "submit" from the parent file index.html  */
zohoprojects.emit("submitted", filedetails); 
/* This code throws a status 'submitted' along with an object to the parent file index.html */

Alert

Set and display success or failure alerts.


zohoprojects.invoke("alert", {
                            type: "success",  //or "failure"
                            data: "Permission granted successfully"
                        });

Complete Transition

Mark a task transition as complete


zohoprojects.invoke("completeTaskTransition"); 

Close Transition

Close the task transition pop-up


zohoprojects.invoke("closeTransition");

Helpful?00
Updated: 5 months ago
Share :