I am building a project in GWT and the project requires navigation from one page to another when a button is clicked. How do I do this? Or should I simply write the entire code in the same class file? I know there has to be a way of navigation.
How should I achieve page navigation in GWT?
You should look at GWT Platform
With this library, you can define places. When the user clicks on a button, you just reveal a new place.
In addition, this framework allows you to handle the lifecycle of your GWT components and do some code splitting : page 1 and page 2 can be compiled in 2 different js so that you only load the one you need.
it is also a (and mainly) a MVP framework, like gwt-presenter.
You can do Page navigation through History mechanism of GWT. Here are the steps you should follow:
Add a history string to an iframe of your host page:
Register a ValueChangeHandler that will receive an event of history (page) change. Within this handler you need put a logic that displays the new page.
For example, History.addValueChangeHandler(object of subclass of HistoryHandler);
After doing this whenever you need to navigate to another page do the following: History.newItem("history string of your page to be displayed");
Related
I am working on a chat application where I am using a webView to show the conversation between sender and receiver and another webView to write the message which will contain text and emoticons (the reason for using webView is that it is capable to show emoticons along text using html), the 2nd webView is editable by setting its contenteditable property to true in html, now the problem is that when I drag and drop text or copy text from somewhere which contains formatting, links and images it will be shown with all the formatting that is why I want to disable dragAndDrop and pasting text from external sources such as browsers, if the text contains links then by clicking that link it will direct you to that page and the webView will become a web browser.
Tricky (i think). One way to do it is by providing your own EventDispatcher instance and intercept the actions you want to prevent, e.g. intercepting the DragEvent to prevent drops and the key events for the paste action. The downsides to this approach are, of course:
1) You'd have to code platform specific for the paste shortcut (CTRL+V vs. META+V)
2) If you want to disable pasting via the context menu this way, you'd have to prevent it from appearing at all. However I think in your case that would be intended.
So, pending a better a better solution I'd go with the dispatcher. Determine which events you want to be processed and forward those to the dispatcher chain. Consume the events you want to prevent.
I would like to know which are the different available approaches to add, modify and delete UI components before a page loaded.
A practical example that I should handle is the following:
In my ADF Fusion Web Application (developed with JDev12.1.3) there are the pages login.jspx and main.jspx: if the user logs in correctly navigation to main.jspx happens.
In main.jspx there is an empty menu bar that at runtime I would like to fill with menus and menu items when the page loads, in function of the logged in user.
In the same page, in function of the logged in user, I also would like to add at runtime some UI components (output texts, buttons, ...) whith the chance to set their properties.
Could you kindly advice me which approaches I can follow to accomplish these duties?
Thanks,
Federico
Why not using the rendered attribute? Based on the condition the components will be rendered or not.
Personally the two approaches i've used on my works where:
1. Using the beforePhaseListener on the f:view component. Example: Before Phase on JSF page. But it might cause you some problems when taking account of adf lifecycle, especially if you have integrated parts (or even some simple jQuery components...).
2. And i think this would just do fine in your case, use a f:event component of type "preRenderComponent". Example: How to use prerendercomponent. I suggest this second option
Note: It's true that these aren't ADF Faces components, but since it's built on top of JSF, they work as they should. I can assure you they do work on 11g and don't expect any problems on 12c.
I see two approaches. Use addChild() and related methods to physically add/remove menu items, or have the menu pre-built and use the visible property to show hide items.
As far as making this happen in custom code, you can use a Backing Bean (Managed Bean) that contains the code to determine what items to add/remove or make visible based on whatever criteria you choose. To call this code, you can 1) use the Invoke action in the rebinding layer - have it call the desired backing bean method - make sure to drag the Invoke action the TOP of the executables list. This is the older, less preferred method. The newer, more preferred method is to add the backing bean method to the Task flow and have it navigate to the deserted page. This method can be part of the navigation form another page. Ex: After successful Login, navigate to your method an chav sit navigate to the Main page. The method will execute before the page loads and will set values to have the items added or visible or not.
RichSelectOneChoice choiceList;
List child = choiceList.getChildren();
child.clear();
for (int i = 0; i < child.size(); i++){
child.remove(i);
}
if ("1..1".equalsIgnoreCase(ccCode)){
UISelectItem addChild = new UISelectItem();
addChild.setItemLabel("1..1");
addChild.setItemValue("1..1");
child.add(addChild);
} else if ("0..1".equalsIgnoreCase(ccCode)){
UISelectItem addChild1 = new UISelectItem();
addChild1.setItemLabel("0..1");
addChild1.setItemValue("0..1");
child.add(addChild1);
UISelectItem addChild2 = new UISelectItem();
addChild2.setItemLabel("1..1");
addChild2.setItemValue("1..1");
child.add(addChild2);
}
Have you posted this question to he ADF forum, here?
I have been writing some basic code for an application I am designing. I have learned the basics and gotten some simple database connection working with RPC calls etc. What I need to do now and am completely lost (as I am traditionally a c# developer with windows forms).
In c# if I wanted a new form I would just create it, and then call the show method.
How does one create multiple pages in GWT, and switch between them?
Thanks in advance,
Chris
The simplest way would be to
Make a new java class (GwtHome.java, GwtHelp.java etc)
Extend these classes by using the Composite class
Make the equivalent of a Master Page and add it to the rootPanel as a class with the appropriate headers, menu, footer and Content Placeholder (Could be any of the AbsolutePanel, VerticalPanel, HorizontalPanel objects provided by the GWT Framework)
By clicking on the menu clear the Placeholder and add the appropriate object of GwtHome, GwtHelp etc.
After getting aquanted with the above procedure, you might want to break up the code in many files using a design pattern as suggested by Andrei.
Simply clear the root panel (RootPanel.get().clear()) and add the widget for your new "page", the same way you added your first one.
If you're using LayoutPanels, do RootLayoutPanel.get().clear() instead.
Look at Activities and Places design pattern: https://developers.google.com/web-toolkit/doc/latest/DevGuideMvpActivitiesAndPlaces
I highly recommend it for a multipage GWT app. It explains pretty well how you create different "views", that are driven by their "activities", and tied to specific "places" (pages) that users can navigate.
Typically you use a LayoutPanel as your "page" container that occupies the entire available browser window. You split this LayoutPanel into 2-3 layers (zones), like top menu, side menu, main area. Each area contains one widget, usually a ScrollPanel, FlowPanel, or HtmlPanel. Then you use different widgets or HTML inside each of these widgets to display whatever you need. You may also create your own composite widgets that you can reuse in different pages.
i am using GWT Hyperlink for Click handling.I used rpc for showing the records in a dialog box by clicking on that link.but it is moving to home page immediately and showing the dialog box there.Please suggest me the solution for this problem.
Hyperlink should be used in combination with History (http://code.google.com/intl/nl-NL/webtoolkit/doc/latest/DevGuideCodingBasicsHistory.html) changes and not for click handling alone. When using Hyperlink the History token is updated, which will probably trigger the History change which will direct to the homepage, Next the click is handled which shows the dialog
EDIT:
Just as David mentions it's better to use the Anchor widget. Because Anchor is a native html element A, it's usability is better over using a span or div.
I concur with Hilbrand, but recommend anchor tags in such cases.
<g:Anchor name="whatever">Click me</g:anchor>
For this case I would suggest you to use CustomButton instead of HypherLink. For that custom button give some styles to look like a hypherlink. If you use label you cannot focus using keyboard.
Use hypherlink only if you are planning to give history support.
Hi firstly i want to mention that i am aware of ajax based application and reuse of same page.
The requirement here is that, i want to have two separate pages one for login and other for the main application. Now, this is not because i just want it, but because i have very different layouts in the two pages which i am comfortable to put together with html elements and css directly in the page and then putting divs to contain dynamic html for gwt to populate.
Even in case of myfaces i have not seen application with same page for login and the main app page.
Anyways, the problem i am facing is, lets say i have two pages
Login.html with a div : div id="login"
Main.html with a div: div id="main"
i have declared both of them in my welcome file list in web.xml
Now i start with Login page fill the "login" div with gwt widgets and on click of a button
i am using following jsni code to redirect to "/Main.html?gwt.codesvr=127.0.0.1:9997"
private native void gotoURL(String url) /-{
$wnd.location.href=url;
}-/;
and then trying to populate the "main" div. But the behaviour as i noticed is that the application call the entry point again and it doesnt find any element as "login" and gives NPE.
Is there a way to do this? also to get rid of the "?gwt.codesvr=127.0.0.1:9997"?
Thanks
First, you don't want to add the ?gwt.codesvr=... stuff - it's related only to hosted (debugging of gwt) mode. You could use a relative url (for example simply "Main.html"). But since you can only have a single entry point, you need to either split the app into two client modules (two separate apps actually) or dispatch in your entry point according to the url (whether you've landed on Login.html or Main.html)
Second, what I would do in this scenario is have an empty html with no layout except a single div for the dynamic content as the only html page of the app. Then I would use 2 UiBinders - one for the main page, and one for login, and use a hash suffix in the url (using GWT's history event and management, and hyperlink widgets) to know where I am. Maybe you should read more in GWT's documentation on history and stateful apps. Try http://code.google.com/webtoolkit/doc/latest/DevGuideCodingBasicsHistory.html#stateful