I have a dialogue box that is:
Draggable
Modal
Requirement:
I have a requirement where I don't need to close my dialogue and have to load the different pages in the background on the selection of data from the grid that is on Dialogue.
What did I do:
I know how to open the page in the background with the help of a de-attached listener.
vehicleInfoPopUpView.addDetachListener(e -> {
UI.getCurrent().navigate(AssignmentPageContainer.class,
String.valueOf(vehicleInfoPopUpView.getCanFileNumber()));
});
The above code (in the parent page) loads/opens a new page but to do this I have to close my dialogue box (which I don't have to do, I have to keep the dialogue box open).
I cannot find any resource that tells me How to load/open a new page in the background from the dialogue box without closing it
Any small help! Thanks for the help in advance.
First of all: Don't.
Keeping a modal dialog open whilst navigating to a different page/route makes no UX sense. A modal window means you cannot interact with the background.
Just call UI.getCurrent().navigate(AssignmentPageContainer.class) directly (outside of detach listener) to open the view based on the selection. The user will open the dialog again himself, if he will want to. You can trigger this on some button click.
Secondly, as a workaround you could store the state of the dialog in a #UIScoped service and open & reinitialize the dialog f.e. in the afterNavigation method.
Related
Why doesn't rails turbo-stream-from update the dom when we're not in the application tab in the browser?
When we go back to the tab in the browser where the application is, all items are inserted at once at this point.
I don't know the logic exactly
but I think there are 2 possibilities:
it uses Browser Window focus event, so the update will be done when the user has opened the tab
it's a limitation from the browser, to prevent unnecessary CPU usage, it doesn't want to update the content if user is focusing on another tab
I am Using Vaadin Framework in my application. I want to open a popup screen using Vaadin Link. I know to open popup thrugh button but I need to open popup through Link. Can anybody help, this is my code:
Link link1 = new Link(String.valueOf(rs.getInt(1)), new ExternalResource("#"));
_reportTable.getItem(dashboardDataRowId)
.getItemProperty("todo").setValue(link1);
As explained in in Book of Vaadin - Components - Link, Link should be used only for hyperlinks to external resources, as it is nothing more than a wrapper for a anchor html tag and as such it does not fire any server side events. As a result you cannot react on server side to open a popup window or do some other logic.
The Link is a regular HTML hyperlink, that is, an anchor
element that is handled natively by the browser. Unlike when clicking
a Button, clicking a Link does not cause an event on the server-side.
What you really want is vaadin button styled as a hyperlink. You can do it by creating a regular button (which supoorts server side events and can open your popup) and then adding an appropriate style.
Button linkButton = new Button();
linkButton .setStyleName(BaseTheme.BUTTON_LINK);
Always be sure to call addStyleName() instead of setStyleName() as it only adds your new style to the list of other styles already present and it does not override that list with your only new style.
So I have a page and a dialog. When the user click the page button, one AJAX request will open the dialog with the results. Something like that simple example without AJAX: http://jsfiddle.net/rBBpx/
It works. The dialog opens programatically. But it hides the page content, showing the dialog as if it's another page. I know that popup's can open dialogs in-page with links, but I didn't get the point in how I can do that programatically.
I tried to change $.mobile.changePage() call to that, but it didn't worked as I expected:
$('#dialog').popup();
$('#dialog').popup('open');
How can I show that dialog in-page, as a popup? Is it ever possible? Thank you in advance!
In case you use phonegap, there is an alert plugin: http://docs.phonegap.com/en/edge/cordova_notification_notification.md.html
navigator.notification.alert("your AJAX result here");
In a multi page template,I have three category pages (comedy, action, drama) that you can swipe between each containing rows of images (Seinfeld, Modern Family, Family Guy, Big Bang). Clicking on an individual image should open a dialog box (Seinfeld summary), close when you click the close button, and stay close. Initially it works, then what happens is based on the number images click after two, it opens and closes n -1 (clicking the 3rd image, opens the dialog box twice).
what could be the reason behind this?
Without your code I can be sure but I think I understand what is happening to you.
You have a problem with multiple event binding. Because of jQuery Mobile architecture it is possible to bind an event numerous time to some object.
I have an blog ARTICLE on jQuery Mobile page events handling and there's a chapter dedicated to this problem, just search for the chapter Prevent multiple event triggering. Or it can be found HERE.
In few words always unbind event before you bind it to some object to prevent this from happening:
$('#test-button').die('click').live('click', function(e) {
alert('Button click');
});
Inside a page called Program edit, there will be a button named Select image and as it is clicked, a Pop-up window will open which shows list of images. After selecting an image from the list and click to the Add button, pop-up will close up and selected pictures ID will be passed to main window. It should be available to use at program's params after closing image list popup.
Here is the scenario I would like to have.
Which way should I follow while doing this?
You need a version of responds_to_parent rails plugin. That can do the trick.
I've learnt that I can do it via JavaScript and AJAX. Similar to this: http://snipplr.com/view/7461/get-selected-value/