Is there any way to display an alert in AEM?

[jiros9220070]

I am working on AEM 6.3, Is it possible to show alert message based on the condition from back end process?

if(true){

     //show success message

}else{

     //show error message

}

[viveksachdeva]

What do you mean when you say some backend process...

If on your page, you want to show alert like this based on response of an Ajax call, it should be standard, JS/CSS thing. Add your alert on the page and keep in hidden by default. Once ajax call returns, check your condition and remove hidden attribute of the alert using JS/jQuery

[jiros9220070]

Thanks for the reply and sorry the question is not clear. I would like to take translation project for example.

When I do Request Scope in a translation project created by Bootstrap Connector, I need to make a Http call to a remote server, if the response like {"success": "false", "message": "some error message ..."}, an error message should show on the project page but the content of the message should come from the message item in the response.

So in Java file, is there any way can send the messages to front like:

if(success){

     //do something

}else{

     //send error message to front

     addErrorMessage(response.message);

}

[susheel]

Return true or false from backend and based on response you can show alert using coral ui if its in authoring mode.

Go through this document for alert using coral ui.

Documentation | CoralUI

[jiros9220070]

Thanks for the reply. Yes, I am working in author mode. Basically, I need to make a Http request in Java class to a remote server and based on the value of "success", show the message in the response to Coral Alert section of the project page. Please refer to comment for viveksachdeva.

[Lokesh_Shivalingaiah]

you can handle that in the frontend code

Those alerts are all based on css class like success, error, warnings etc..

one of the approach could be as below

So based on your http response, set a variable for css class and the message

and based on the variables, display the div in html.

[jiros9220070]

Thank you for your reply. I think this is what i need to implement but I am new to AEM and Java Content Repository so could you provide more details about this solution.

Since the frontend page is a translation project page that is created by AEM, is ti possible to pass variables to that page?

[GaneshM]

Hi,

you can create alert in couple of ways

1. Coral Alert - Using coral alert you can display the error message and you need to append element to show up the alert.

                    var alert = new Coral.Alert();

                    alert.variant = "error";

                    alert.header.textContent = Granite.I18n.get("ERROR");

                    alert.content.innerHTML = Granite.I18n.get("Failed to load log content.");

                     $("#selector").append(alert);

if you are using AJAX to interact with CRX repo, then you can add exception or failure code in content attribute.

2. Using HtmlStatusResponseHelper

    htmlResponse = HtmlStatusResponseHelper.createStatusResponse(false, i18n.get("Cannot create page ({0})", null, e.getMessage()));

    htmlResponse.send(response, true);

You can get more details in

Documentation | CoralUI-Alert​

in OOTB page comp - /libs/cq/gui/components/siteadmin/admin/createpagewizard/page/POST.jsp.

Cheers!