I have a Java EE 7 project and in web application part I am trying to open JSF forms.
However when I run it, it just sees the initial form.
How can I enable it to reach other forms?
Small example from my code:
<body>
<h:form id="firstForm" prependid="false">
...
</h:form>
<h:form id="secondForm" prependid="false">
...
</h:form>
</body>
This answer helped me a lot. And also there were some referance problem. After correcting them, I can see all the form structure.
I know the code above is not nested form structure, but for other people who are curious about this issue, you cannot make nested forms in HTML5 (for both <h:form> and <form>). So be careful to your template.
Good luck!
Related
We have a web application that its UI is based on GWT.
We are pretty satisfied from the technology, but we have one major problem: We get html files from our designer, and it takes a lot of time to integrate them into our GWT code.
Is there a quick way or rules to do that?
For instance, I would like to take the html, put it almost "as is" in a ui.xml file, and then start binding the components to UiBinder fields.
What is the quickest way to do that? What should I do with the CSS and JS files that I get?
I need some guidelines to make this conversion, so it will be quick & easy.
We have the same problem. It might be hard for a designer to get used to GWT widgets. But he'll have to forget about making HTML proof-of-concepts and using GWT directly.
We didn't overcame the difficulty. As a result, many GWT features are under-used (like CSSResources, or GWT-Bootstrap layout capabilities).
I would advise to have him learn the xml of GWT widget libraries.
You can also start by using GWT Designer. This way he can still do the design, learn the XML bit by bit, and you can still work on wiring the components.
Of course it is a slow process. People don't change old habits instantly.
Errai seems to fit your requirements.
Basically is uses regular HTML5 templates, binded to GWT logic.
"Create standard conform HTML5 templates or use existing HTML and CSS files to design your web and mobile applications."
http://errai.github.io/
Here is an example of a sign-in page:
<!DOCTYPE html>
<link rel=stylesheet href="css/TodoList.css">
<div data-field="main">
<h1>Get it done with Errai.</h1>
<div class=form>
<p class=error data-field=loginError>
Login failed. Please check that your email address and password were entered correctly.
</p>
<input type=text data-field=username placeholder="Email">
<input type=password data-field=password placeholder="Password">
<button data-field=loginButton>Sign In</button>
<p>New here? Sign up in seconds!</p>
</div>
</div>
source
(p.s. I've never used it, yet)
is it possible to have parts (instead of the entire page) of an HTML page written with GWT?
Is it usual?
I'm quite new to GWT and trying to understand the workflow of it.
Thanks.
I meant HTML static pages, written by hand (or any other means) and on these pages have parts (forms, media, whatever...) in GWT.
Yes, the simplest way this can be achieved is setting an id attribute on the elements you want to be filled in by GWT, e.g.
<body>
<div>
...
<div id="myId"></div>
</div>
</body>
, and then using
RootPanel myIdPanel = RootPanel.get("myId");
so you can put any GWT contents into myIdPanel.
Note, that there are many more ways to mix HTML that's generated by GWT and by other means - basically any combination is possible.
You might want to check out their UIBinder approach:
http://www.gwtproject.org/doc/latest/DevGuideUiBinder.html
I need list of primefaces elements that need to be wraped by <h:form> in order to be updated by any action of <p:ajax>some primeface elements even if they have id and in <p:ajax update="thisID"> it still needs an <h:form> with an id in ordered to be updated so which elements need <h:form> and whick not
To the point, all components implementing the EditableValueHolder interface and the ActionSource interface needs to be enclosed in an UIForm component.
In the aforelinked Javadocs you can find in the "All Known Implementing Classes" indications which components implement them. If you look closely, then you'll notice that it are all input components like inputText, selectOneMenu, etc and command components like commandLink, commandButton, etc. In the PrimeFaces API documentation, for example the InputText which represents the <p:inputText> implements EditableValueHolder, so it should be placed in a form.
It's also exactly the same rerequirement as in plain vanilla HTML has, the HTML <input>, <select>, <textarea>, etc should go in a <form> in order to get value to be sent to the server side. HTML is also what JSF ultimately produces, after all.
As to updating elements by ajax, it's not true that the to-be-updated components needs to be placed inside a form. You can perfectly update content which is outside the current form. You can even update other forms.
This is a slight modification to PatrickT's Answer. You are able to update things outside the form also. But data you want to submit should be part of the form afaik.
<p:messages id="outsideForm" showDetail="true"></p:messages>
<h:form id="kalle">
<p:messages id="insideForm" showDetail="true"></p:messages>
<p:inputText required="true"></p:inputText>
<p:commandButton value="submit" update=":outsideForm,insideForm"/>
</h:form>
Every component submitting/receiving Content from/to a backing bean needs to be wrapped by <h:form>.
So everything you want to update or every Button / Link setting something needs to be inside a form. Also this isn't a Primefaces thing. This rules apply for normal JSF too.
We are working on a project with JSF and PrimeFaces and we are looking to add dynamic inline validation on our forms. I'm not sure if PrimeFaces can handle this (correct me if I am wrong) so I am looking for some alternatives
Does anyone know of any plugins we could use to do this? Prefer something that incorporates JSF too...
I'm not a developer but a UX guy so sorry if some of the terminology is incorrect.
Standard JSF supports server side validation by ajax (live example here) and PrimeFaces definitely also supports it (live example here). You can add <f:ajax event="blur" render="message_id" /> inside input components to perform validation directly on blur (see also this tutorial).
<h:inputText id="foo" value="#{bean.foo}" required="true">
<f:ajax event="blur" render="foo_message" />
</h:inputText>
<h:message id="foo_message" for="foo" />
The Facebook comments count can be done in three different ways: (without directly using JS)
<fb:comments-count href="http://example.com" />
<iframe src="http://www.facebook.com/plugins/comments.php?href=example.com" />
<div class="fb-comments-count" data-href="http://example.com">0</div>
The issue, however, is that doing something like this messes things up:
<p><div class="fb-comments-count" data-href="http://example.com">0</div> comments</p>
...because a <div> is firstly, not valid inside a <p> tag and secondly, looks wrong (though this could be fixed with CSS).
Basically, my question is: is there a way to do the above without using a <div> (a <span> for example), bearing in mind that I want to use the HTML5 method and (if possible!) want to avoid using javascript?
Clarification: I would like to avoid writing extra JS in the page simply because the MVC view currently looks nice and clean and I would prefer to keep it that way. Obviously, I'm still including the Facebook Connect library.
So, one solution would be to use a DIV instead of a P as the outer element.