Software Archive
Read-only legacy content

Popup with buttons

Ruben_S_
Beginner
692 Views

Hi all, 

I'm looking for a way to open a popup. The popup need to have 4 buttons. 

In the APPDesigner there is an option to put a popup element on a page. However I have no clue how I can communicate with this popup.

Anyone has a suggestion for me?
Thanks

0 Kudos
8 Replies
Dale_S_Intel
Employee
692 Views

What framework are you using?  The default is AppFramework, I believe.

What widget are you using for the popup?

 

Dale

 

0 Kudos
Ruben_S_
Beginner
692 Views

I'm using bootstrap. 

In the app Designer under Controls -> Over, I have two elements, Alert and Popup. 

I want to have the Popup because I can modify it and place buttons on it. However I have no idea how I can call the popup when I press another button in the view. When I drag it onto the view and run it in the emulator, it is floating above all the other elements and cannot close it. 

0 Kudos
Chris_P_Intel
Employee
692 Views

The Popup should not normally be visible in the Emulator. Certainly, when I test it here, it is not.  But if you've directly modified the code, it can be made to be open.

It is very easy to hook the popup to a button. Use the Interactivity pane in App Designer and find the button you want to be the trigger. In the right hand column open the menu there and you'll see the popup in the list. Choose the popup.  Now the two are hooked together. When the button is clicked in the Emulator, the popup will open.

 

Chris

0 Kudos
Ruben_S_
Beginner
692 Views

I have hooked up the button to the popup. However, when I run it in the emulator, it still opens the popup as soon as I open the page with the attached popup. In the appdesigner I see next to the view a black button where I can enable or disable the popup. Or is it that I need to add the popup to a new empty page and then call the popup?

0 Kudos
Chris_P_Intel
Employee
692 Views

You should look at the code of the popup, and perhaps of the document overall, to make sure it is well-formed.

If you need something to compare against, make a new .html file in your project and open it in App Designer and add a popup there. Look at its base code for comparison. Or see the docs here: http://getbootstrap.com/javascript/#modals

 

 

0 Kudos
Ruben_S_
Beginner
692 Views

I have made another project and looked at the code. I made sure that the code setup looks exactly the same in my main project. But unfortunately it is still not working. 

When I add the popup to a page in the AppDesigner, it shows me the popup plus a white background. I noticed that in other projects no white background appears when adding the popup. In other projects I can see the underlaying elements which I don't see in the main project.

 

0 Kudos
Ruben_S_
Beginner
692 Views

I have it working now. I'm not sure what the problem actually is but I have renamed the folder "ionic" to "ionic0". I have switched frameworks a few days back. In the chrome develop tools I noticed that on the modal ionic css was applied. 

Thanks for the help everyone!

0 Kudos
Thomas_B_6
New Contributor I
692 Views

Hi,

just use a modal dialog, the you can have as many buttons as you like.

cheers,

tom

0 Kudos
Reply