Show popup on click on text link in traditional web app
Application Type
Traditional Web

Hi,

I need some help to show the pop-up on click of text in traditional web app.

Any help will be appreciable.

Thanks 

Prince

Dear Prince.

Please follow the attached OML. It might help you. 

Thank you.

Popup.oml

Thanks for the answer. But How it will work on web block?

Champion

Hi Prince,

In addition to Porselvan's reply, You can also use modal to achieve it.

https://success.outsystems.com/ja-jp/Documentation/11/Developing_an_Application/Design_UI/Patterns/Using_Traditional_Web_Patterns/Content/Modal

>Thanks for the answer. But How it will work on web block? 

Can you provide more detail information

Kind regards,

Thanks Tom,

I have a web block which I'm using in a web screen. And in the web block I have some text and on-click of that text I'm trying to show the popup in the traditional web app.

Hi Prince,

For that you can use modal preview.

Kind Regards,


Champion

Hi Prince,

In my understanding, there is no difference using the modal in the WebBlock or Screen.

Sample OML file attached.

Kind Regards,

ModalInPopup.oml

Hi Prince,

Follow the below steps or refer the attached OML to achieve popup action on click of text link in traditional web app.

  1. Create a web block with some text.
  2. Open widget tree & right click the text and link it to a new action & name it open popup.
  3. The above action should have the following property: Ajax Submit & Validation has none.
  4. Search for Modal in the widget box from the left & drag it into the web block.
  5. Name the Modal as Modal or something
  6. Add a button[New screen action] inside the Modal widget to close the popup
  7. The above action should have the following property: Ajax Submit & Validation has server.
  8. Open the open Popup[step 2] action search for Toggle modal from the search input in the top right corner.
  9. Drag the Toggle modal b/w start & end of Open Popup action
  10. Map source of WidgetID as Modal.Id[the Modal widget name we mentioned in step 5]
  11. Follow the same for Close action
  12. Use the web block in the preferred screen & test.

Regards

 Ajay A

ModalInPopup.oml

Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.