Is there a way to VIEW the HTML source code that GWT produces? Currently I just give my flex table the DIV id and that DIV is all HTML I can see in ViewSource.
Is there a way to structure my table in HTML (say using div's and lists) and than create a something like FlexTable around that?
To answer the original question, you can view the HTML GWT has rendered via 'Inspect Element' in Firefox, with Firebug is installed. Alternatively the Web Inspector in Safari/Chrome will do the trick, as will the Developer tools in both IE8 and Opera.
Well well it seems the answer is in the documentation.
In particular Organizing Projects outlines how we can bind different widgets to different id's on the page.
So I can effectively do something like:
# html
<div id="id_table"></div>
<div id="id_next_button"></div>
# java
t = new FlexTable()
RootPanel.get("id_table").add(t);
nextbtn = new Button("next");
RootPanel.get("id_next_button").add(nextbtn);
Wohoo!
Regarding the second part of your quetion. It is possible to create a HTML component in GWT. The recomended way to do this is extending ComplexPanel and create the elements using Document.get().createXXXElement(). But it is a little laborius.
Check out this dicussion and I am sure there are other articles about this around the internet. You can also study the code of other components the extend ComplexPanel.
Related
Is there a way for me to render and parse the SVG element from a html page rendered by javascript in Java,
for example: http://bl.ocks.org/mbostock/raw/4063269/, which in the case is using d3.js.
If I understood you question correctly, your problem is that tools you used (HtmlUnit) cannot handle complex JS (d3.js).
In this case there is nothing better than using an actual browser. You can use Selenium to open your page with a remote controlled browser instance and get JS rendered html from there.
This tutorial contains pretty much all you need. Except the getting html part, you can find it in this SO answer.
After that you can feed the html to any parser you want.
EDIT
Just thought of another way, you can try WebKit Html2Pdf. Its purpose is to create PDF files but it uses WebKit under the hood and you can inject custom script (like document.onload callback) that will post SVG contents to you service after page is loaded.
But I wouldnt go that road, it has many limitations (basically only works for direct urls) and overall is pretty messed up.
If what you're trying to do is get the SVG content as a String, Selenium is your best choice, like #chimmi said. But, you might get away without a real browser window opening by using PhantomJS instead.
In theory, it should work like this:
System.setProperty("phantomjs.binary.path", "/path/to/phantomjs");
WebDriver driver = new PhantomJSDriver();
// Open your page with SVG
driver.get("http://localhost:8080/svgpage");
// Find the SVG
WebElement svg = driver.findElement(By.tageName("svg"));
// Get its XML content
String xml = svg.getAttribute("outerHTML");
From here, you could use Batik if you want to actually render the SVG on screen in your non-web app.
Or, if all you wanted was to make assertions on the SVG contents for testing purposes, remember you can select sub-elements using normal CSS or XPath selectors:
//Select all <path> elements within the SVG
Lis<WebElement> pathElementsInSVG = svg.findElements(By.tagName("path"));
//Assert there is 4 <path>s
assert pathElementsInSVG.size() == 4
I'm working on a vaadin page, but one of the elements I want to put in my VerticalLayout is a java.awt.Frame. Is there a way to do this in vaadin?
As said in the comments, you can't use Swing/AWT stuff in Vaadin since it will be converted to Javascript and DOM to be used in a browser.
If you get a hold on the JS file TeeChart uses you can basically implement a custom client-side widget that will use it.
Take the basic demo here what you have to take care of is that there is a <canvas> tag to render the content in and that the draw() is called at a phase when Vaadin is done creating the surrounding DOM structure.
Please have a look at this tutorial to get an idea on how to wrap a JavaScript library to a Vaadin component.
I'm working on a web project which uses JSF 2.0, PrimeFaces and PrettyFaces as main frameworks / libraries. The pages have the following (common) structure: Header, Content, Footer.
Header:
The Header always contains the same menu. This menu is a custom component, which generates a recursive html <ul><li> list containing <a href="url"> html links, this is all rendered with a custom renderer. The link looks like 'domain.com/website/datatable.xhtml?ref=2'. Where the ref=2 used to load the correct content from the database. I use prettyfaces to store this request value in a backingbean.
Question 1: Is it ok to render the <a href> links myself, or should I better add an HTMLCommandLink from my UIComponent and render that in the encodeBegin/End?
Question 2: I think passing variables like this is not really the JSF 2.0 style, how to do this in a better way?
Content:
The content contains dynamic data. It can be a (primefaces) datatable, build with dynamic data from the database. It can also be a text page, also loaded from the database. Or a series of graphs. You got the point, it's dynamic. The content is based on the link pressed in the header menu. If the content is of type datatable, then I put the ref=2 variable to a DataTableBean (via prettyfaces), which then loads the correct datatable from the database. If the content is of type chart, I'll put it on the ChartBean.
Question 3: Is this a normal setup? Ideally I would like to update my content via Ajax.
I hope it's clear :)
It's ok to just output link yourself, commandLink is out of the question (it does a postback using javascript, it's not what you want);
Parameter are all in the param implicit object. You can insert them by a #ManagedProperty annotation, like this:
#ManagedProperty("#{param.ref}")
String ref
// .. getters, setters (obligatory!)
You can also use (if you are on JSF 2) the f:viewParam tag (a nice description http://blogs.oracle.com/rlubke/entry/jsf_2_0_bookmarability_view), you get the bonus of validation and conversion.
The way I understand it, your setup is rather complicated. Using a handwritten custom component for a menu is a huge overkill (at least judging from the provided description), a composite component would probably do. JSF has no special way of making ajax calls between views or embedding views one into another, so - unless you use iframes - your only choice would be to include all the possible pieces of content into a single view, wrapped in panels, and render them as required:
<h:panelGroup rendered='#{backingBean.ref == 2}'>
... content 2 ...
</h:panelGroup>
and so on. Careful, this would be heavy on resources.
You could also write your own ajax solution in javascript. This would require all the pieces of content to be fully independent views, with their own forms. Also, all their postbacks would have to go through ajax, so the main page does not get reloaded.
I am trying to use this plugin from JQuery, however how do I populate the options of the selection of the combo box? I am pretty new to JQuery so some help would be appreciated
So say I have a html code as follows:
<select name = "test">
<option>1</option>
<option>2</option>
</select>
what should I do to make it so I have the interface above?
Checkout the example on this page.
You still create an html select element with child options. Then you turn it into a jquery combobox with either a really simple $('#comboboxid').combobox(). If you want, I can help you with the more advanced options.
This jQuery plugin only enhances the look'n'feel of a HTML <select> element with customizeable CSS styles. It doesn't require any changes to standard HTML/JSP/whatever code you're using to populate the options. You can just write down the dropdown options the usual way in JSP as you would do without this jQuery plugin.
By the way, that plugin is pretty old and its name is fairly misleading. A combobox is in essence an editable dropdown. But this plugin does nothing about that at all. What's actually your functional requirement? Aren't you looking at the wrong plugin?
Update: as to how to use it, just include the required JS files in <head> and call $(selector).combobox() during document load. There's even a complete example here (note that you need to click the "click to view/hide" link to see the HTML).
Is there a way to change the css style(defined in the page source) dynamically with Java? I know it is possible to do it with JavaScript. If there isn't, are there other situations where JavaScript is the only choice developing a web app?
Matthew is right. The question should be specified better.
If you are about applet that is running on current page your can call any javascript including javascript code that changes style of any element.
You just have to add attribute mayscript to applet tag and then use code like the following:
JSObject win = (JSObject) JSObject.getWindow(this);
win.eval("documeent.getElementById('myelem').style='border-color: red'");
If you are asking about sevlet/jsp you can
1. generate full html code including css
2. bind style element to URL that is mapped to servlet or JSP that generates CSS.
where styles URL brings us to servlet that generates css dynamically using parameter "id".
I hope it helps. Otherwise please try to specify you question.
Why don't you use JS in the JSP page like you would in a regular HTML page?