Can I replace h:commandLink with h:link - jsf

I'm creating a mobi-site using jsf. I got right to the end and found that more primitive phone browsers can't handle the javascript that commandLink creates. Is it possible to circumvent this with h:link or do you have any other suggestion as to how to get around this?

The <h:commandLink> generates a HTML <a> element with JS code in onclick to submit a POST form.
If your functional requirement is to submit a form with some data, then better use <h:commandButton>, it doesn't generate JS code.
If your functional requirement is to navigate to other page, then you should definitely use <h:link>, or <h:outputLink>, or just plain HTML <a>.

Related

Is it possible to show only the confirm, and not the cancel button icon in Prime Faces DataTable rowEditor?

Is it possible to show only the confirm, and not the cancel button icon in Prime Faces DataTable rowEditor?
I ended myself with this approach
As stated by #Kukeltje it's possible to manage similar problems on client using
some css to hide it (it is all html, css and javascript on the client).
I choose jquery to handle html, css, and javascript (I'm relatively new to jsf/primefaces but I read it's based on jquery).
So in managed bean I was able launch scripts like this:
PrimeFaces.current().executeScript("$('#myForm\\\\:myContainer .ui-row-editor-close').eq(-1).remove();");
or even in XHTML/JS script like this:
<h:outputScript library="js" name="myScripts.js" />
$(document).ready(function() {
$("#myForm\\:myContainer .ui-row-editor-close").last().remove();
});
Anyway with this approach you need to be carefull, any ajax call which update part of the page involved reset to default, so cancel button will re-appear.

Render a jsf element on mouseover

I have a <h:panelGrid> and a h:commandLink(link is basically a image).Now I want that on mouseover event , Then link should be render(render='true') and on mouseout event, it gets removed render='false'.But I am unable to create the logic that How can I do this with these events as the approach I am using is To set the values of bean true and false on this event.
Here is my code
<h:form>
<h:panelGrid mouseover='** we cannot call a bean method here which changes the bean value **'>
This is the Div On which I want to apply mouseover event
</h:panelGrid>
<h:commandLink id="btn" render={renderBean.renderLink}>
<h:graphicImage url="image.jpg"/>
</h:commandLink>
</h:form>
The default value of renderLink attribute of renderBean is false. Now I want to know the way that How can I change its value to true on mouseover event? Is it possible? OR Anyother solution in JSF w.r.t this requirement
You have to remember in JSF that the page will first be processed server-side by the JSF engine in the web server. At that time all JSF tags will be converted into their HTML equivalent. The render attribute tells the server-side engine whether or not to output an HTML a (anchor) link in the place of the <h:commandLink> element.
The behavior you're looking for, namely responding to mouse events, is client-side functionality. It happens in the browser, not at the web server, so no JSF is involved. The solution is to handle the mouse events in JavaScript, not JSF. You will typically set (or remove) the CSS attribute display:none on the id called btn (unfortunately it's slightly more complex as JSF will mangle the element id a bit). There are lots of posts here on StackOverflow that deal with how to handle client-side events in JavaScript. Using jQuery for example is a really common approach.
I recommend to get started you take a look at the blog of one of our best JSF resources and long-time StackOverflow user BalusC: http://balusc.blogspot.com.
There's a lot to learn and you'll get a good start by going there first (and searching for his posts on SO).
Good luck.

How to move within only one part of the page

I have read many answers written mainly by BalusC but still no luck.
So I included via ajax rendering, a page in the part of the main page and it works perfect, whenever I click the button on the main bar the subpage xhtml is shown in the proper place. Now the problem is that i want to implement in that subpage a "selectOneMenu" so whenever a user clicks on one of the options he will be redirected to another xhtml which should appear on the same part of the page (instead of the previous page). I have already thought of many ideas to solve that(including conditional rendering), but I believe that there has to be much simpler and more correct way to solve it. Maybe JSF has some kind of container tag which could be used?
PS
By the way that is my first post so sorry if I didnt make something clear.
UPDATE
It appeared to me that maybe I should somehow use ajax onValueChange which would read the value (via the actionListener ?) so when the user clicks on subpage the main page would read the value and render part with the new content. Is that even possible?
You can use valueChange Listener to get the new value and in your bean using FacesContext you can redirect the page but make sure that you add ajax call to your selectonemenu if you dont want your page to refreshed.
<h:selectOneMenu value="#{some.value}"
valueChangeListener="#{some.valuechanged}">
<f:ajax event="change" listener="#{some.listen}" />
</h:selectOneMenu>

Difference between a4j:commandLink and h:commandLink

Title says everything.
What is the difference between a4j:commandLink and h:commandLink?
From richfaces docs
The <a4j:commandLink> component is
very similar to the <h:commandLink>
component, the only difference is that
an Ajax form submit is generated on a
click and it allows dynamic
rerendering after a response comes
back. It's not necessary to plug any
support into the component, as Ajax
support is already built in.
More info about h:commandLink here and a4j here.
Read both and you will be able to make your own conclusions.

Jsf component for html tag

Does it exist a way to create a <a name="bookmark"> in jsf?
I would like to create a list with general bookmarks so that i can point them with links, i would like to create these links with values I take dynamically.
h:outputLink doesn't have a name attribute.
Using outputLink like this:
<h:outputLink id="bookmark" />
generates the html:
<a id="bookmark" href="" name="bookmark"/>
So you could use the ID as your pointer?
Use Javascript or Output Filtering or a Custom Component
I think I would just use Javascript and patch up the anchors onload.
However, you could do output filtering. You could wrap the sub components inside your own and parse and modify the output. That does seem like a lot more work than just tweaking the document with JS.
If you are willing to create a custom component using facelets, a true but heavyweight solution, just go over here: How to add a new attribute to an existing JSF component.

Resources