Modal Dialog - 2 different messages showed conditionally


I am trying to achieve the following result:

When the user exits a text field (onBlur) I must display a modal dialog that has only some message in it and the OK button.

This has to be done for 2 different fields => 2 different messages.

The easiest solution for this is to create 2 modal dialogs, one for each message. However this seems a bit overkill.

Is there a possibility to create one model dialog with both messages and make them visible/hidden based on a javascript condition?

I am showing the model dialog using javascript:;

Would you be so nice as to drop here some hints on how to achieve this?

Thank you.
Vlad Turian

Maybe you could just create the CAF dialog on the fly from the javascript onblur handler so you wouldn’t have to create any Modal Dialog control at all. See the CAF JavaScript Reference documentation for the details.

For example:

var msg = "hello world";
var okFn = function() {
  //TODO: Ok was pressed in the CAF dialog, so do something here
var dlgOptions = {
  title: "my dialog title here"
CAF.Dialog.alert(msg, okFn, dlgOptions);

Hi Eric,

Thanks for the reply.

In the mean time, I have also found a solution:

  • create a ModalDialog CAF component
  • put both messages in the component and wrap them in hideable panels
  • before showing the modal dialog set the visibility of the hideable panels:

However your solution I would say is cleaner.

Besides the fact that is less coding, to you see other advantages of your solution?

I am thinking of refactoring a little bit the views and removing the modal dialogs in order to adopt your solution.

Thank you,
Vlad Turian