Is bookmarkability achievable though using the includeViewParams=true query parameter with JSF implicit navigation ? If yes, then how ?
First we need to understand what exactly "bookmarkability" is and what exactly includeViewParams does. This way the effect of the combination of both can be better understood.
Bookmarkability concerns the HTTP request URL in its exact form as you see in the browser's address bar. It's exactly the URL as the enduser would store in its bookmarks and/or would copypaste as a link elsewhere, such as a forum, a chatbox, some social medium, or just a new browser window/tab, etc. When a link is followed or an URL is copypasted into browser's address bar, then by default a HTTP GET request will be fired. If the result is exactly the same everytime (leaving authorization/authentication and the time-sensitive nature of the page —search results, last news, etc— outside consideration), then we can talk about a bookmarkable URL. The technical term is "an idempotent HTTP request".
If the enduser has however submitted a POST form on that URL beforehand, which hasn't performed a redirect, then the URL is not necessarily bookmarkable. The submitted form data is not reflected in the URL. Copypasting the URL into a new browser window/tab may not necessarily yield exactly the same result as after the form submit. Such an URL is then not bookmarkable. POST is not idempotent. That's why page-to-page navigation by commandlinks is bad.
Bookmarkability is usually achieved by a specific construct of the URL path and/or query parameters. If you look at Google, the search results are bookmarkable thanks to the q query string parameter.
http://google.com/search?q=bookmarkability
In JSF terms, those request parameters can be set (and converted and validated) via <f:viewParam>:
<f:metadata>
<f:viewParam name="q" value="#{bean.query}" />
<f:viewAction action="#{bean.search}" />
</f:metadata>
If you need to perform for example pagination, and you'd like to keep the URL bookmarkable, then you could add another request parameter:
http://google.com/search?q=bookmarkability&start=10
with
<f:metadata>
<f:viewParam name="q" value="#{bean.query}" />
<f:viewParam name="start" value="#{bean.start}" />
<f:viewAction action="#{bean.search}" />
</f:metadata>
The includeViewParams="true" basically includes all of those view parameters in the generated GET link. With help of this, the pagination links can then look like this without the need to repeat the q parameter:
<h:link value="1" outcome="search" includeViewParams="true">
<f:param name="start" value="#{null}" />
</h:link>
<h:link value="2" outcome="search" includeViewParams="true">
<f:param name="start" value="10" />
</h:link>
<h:link value="3" outcome="search" includeViewParams="true">
<f:param name="start" value="20" />
</h:link>
...
(of course generated by some <ui:repeat> or so)
When entering the page with q=bookmarkability, this will produce the following links
/search.xhtml?q=bookmarkability
/search.xhtml?start=10&q=bookmarkability
/search.xhtml?start=20&q=bookmarkability
Those are bookmarkable URLs and the includeViewParams made creating them more convenient.
Related
I'm a beginner to JSF and I want to code a little searchbar on my future website.
I made two pages : index.xhtml and search.xhtml, and I try to pass get parameters from index.xhtml to search.xhtml, so I made this little formular :
<!-- index.xhtml -->
<h:form id="Form_search">
<h:inputText class="search_bar_text" binding="#{se}"></h:inputText>
<h:button class="search_bar_button" outcome="search">
<f:param name="search" value="#{se.value}" />
</h:button>
</h:form>
To summarize, I want to send the content of an inputText to search.xhtml
But there's a problem : when I click on the submit button, no parameters are passed, so instead of having /search.xhtml?search=foobar I only have /search.xhtml.
I also tried this, but this doesn't work either :
<!-- index.xhtml -->
<h:form id="Form_search">
<h:inputText class="search_bar_text" binding="#{se}"></h:inputText>
<h:button class="search_bar_button" outcome="search.xhtml?search=#{se.value}">
</h:button>
</h:form>
Can someone explain to me the reason of this problem and how I can fix it?
The <f:param value> and <h:button outcome> are evaluated during rendering the HTML output, not during "submitting" of the form as you seem to expect. Do note that there's actually no means of a form submit here. If you're capable of reading HTML code, you should see it in the JSF-generated HTML output which you can see via rightclick, View Source in webbrowser.
Fix it to be a true GET form. You don't need a <h:form>, <h:inputText>, nor <h:button> here at all. You don't want a POST form. You don't seem to want to bind the input to a bean property. You don't want a plain navigation button.
<form id="form_search" action="search.xhtml">
<input name="search" class="search_bar_text" />
<input type="submit" class="search_bar_button" />
</form>
Yes, you can just use plain HTML in JSF.
If you really, really need to use JSF components for this purpose for some reason, then you could also use this POST-redirect-GET-with-view-params trick.
First add this to both index.xhtml and search.xhtml:
<f:metadata>
<f:viewParam name="search" value="#{bean.search}" />
</f:metadata>
Then use this form:
<h:form id="form_search">
<h:inputText value="#{bean.search}" styleClass="search_bar_text" />
<h:commandButton styleClass="search_bar_button" action="search?faces-redirect=true&includeViewParams=true" />
</h:form>
This would perhaps make sense if you intend to use JSF validation on it. But even then, this doesn't prevent endusers from manually opening the URL with invalid params. You'd then better add validation to <f:viewParam> itself on search.xhtml.
See also:
What can <f:metadata>, <f:viewParam> and <f:viewAction> be used for? (scroll to bottom of answer)
How do I process GET query string URL parameters in backing bean on page load?
I have a page with results form a search arranged in pages. When I navigate forwards to the detail view and backwards to the result view, the result view is going to page1. How can I fix this? I am using two ViewScoped beans. I tried SessionScoped, but it will do the same. What is the best way to do this?
result page
<f:metadata>
<f:viewParam name="lang" value="#{search.language}" />
<f:viewAction action="#{result.init()}" />
</f:metadata>
<h:form>
<ui:repeat value="#{result.recipesView}" var="rec">
<h:link value="#{rec.title}" outcome="recipeshow">
<f:param name="id" value="#{rec.id}" />
</h:link>
<br/>
<h:outputText value="#{rec.id}"/><br/>
<h:outputText value="#{rec.author}"/><br/>
<h:outputText value="#{rec.createDate}"/><br/>
<br/>
</ui:repeat>
<br/>
<ui:repeat value="#{result.pagesArray}" var="page">
<h:commandLink value="#{page.pageNumber}" disabled="#{page.pageDisabled}">
<f:ajax listener="#{result.doPages()}" render="#form"/>
<f:param name="currentPage" value="#{page.pageNumber}"/>
</h:commandLink>
</ui:repeat>
</h:form>
If you do the manipulation of view scoped data, like managing the current page via <h:commandLink> it will be available as long as you interact with the current view by making postbacks. When you show the details view you are no longer dealing with results view anymore, so your view information is basically gone. So when you press the browser's back button you will either revert to the first page (in case page is not cached) or to the view as it was left beforehand (in case page is cached), but you'll get a ViewExpiredException.
What you need to do to overcome that difficulty is to hold the information in the URL the back button points to. In other words, give up using post links (<h:commandLink>) to page the results and switch to using get links (<h:link>) instead. The latter will be used to send a new get request holding the relevant information (current page, paging size, paging order, etc.) to show the results. This can be done by using <f:param> and <f:viewParam> tags. In this light when back button is pressed you will be shown the results with the parameters defined in the request. Idempotence of the result is the key in your situation.
So, you'll have a bunch of <f:viewParam> tags to keep the paging data in results view. You also need to change your command links to plain <h:link>s with nested <f:param>s that represent paging data as well.
I have 3 pages:
main.xhtml
agreement.xhtml
generated.xhtml
The agreement.xhtml needs two parameters to load correctly: serviceId and site. So, a normal url looks like this: /app/agreement.xhtml?site=US&serviceId=AABBCC.
I have this button on agreement.xhtml
<h:form>
<h:commandButton value="Generate License File" action="#{agreement.generateMethod}" />
</h:form>
The #RequestScoped bean #{agreement} has this method:
public String generateMethod(){
.......
return "generated";
}
I need that, on click, the generateMethod() method is executed, and after it's done, the user is redirected to the generated.xhtml page. What's happening is that, on click, the page browser sends the user to /app/agreement.xhtml and, since it's not sending the parameters site and serviceId, it crashes.
I tried making the generateMethod() return a "generated?faces-redirect=true", but still nothing. Any ideas?
Your concrete problem is caused because a JSF <h:form> submits by default to the current request URL without any query string. Look closer at the generated HTML output, you'll see
<form action="/app/agreement.xhtml" ...>
You'd thus explicitly need to include those request parameters yourself. There are several ways to solve this. If you weren't sending a redirect, then you could just add them as hidden inputs to the JSF form.
<h:form>
<input type="hidden" name="site" value="#{param.site}" />
<input type="hidden" name="serviceId" value="#{param.serviceId}" />
...
</h:form>
Only, those parameters won't reappear in URL in browser's address bar. This isn't a problem if you're only using using ajax on the same page. The <h:inputHidden> is by the way not suitable as it will confusingly lose its value when a conversion or validation error occurs on the form.
In order to get them to reappear in URL, you need <f:viewParam> and includeViewParams. In order to get includeViewParams to work, you need to declare the following in both the source page agreement.xhtml ...
<f:metadata>
<f:viewParam name="site" value="#{agreement.site}" />
<f:viewParam name="serviceId" value="#{agreement.serviceId}" />
</f:metadata>
... and the target page generated.xhtml:
<f:metadata>
<f:viewParam name="site" value="#{generated.site}" />
<f:viewParam name="serviceId" value="#{generated.serviceId}" />
</f:metadata>
Now you can send a redirect including the view parameters as follows:
public String generateMethod() {
// ...
return "generated?faces-redirect=true&includeViewParams=true";
}
Do note that the bean should be #ViewScoped in order to keep those parameters alive between opening the page with the form and submitting the form, also on validation errors. Otherwise, when sticking to a #RequestScoped bean, you should be retaining them as <f:param> in the command components:
<h:commandButton ...>
<f:param name="site" value="#{generated.site}" />
<f:param name="serviceId" value="#{generated.serviceId}" />
</h:commandButton>
There's no way to set them for <f:ajax> inside input components, your bean should then really be #ViewScoped.
Alternatively, if you happen to use JSF utility library OmniFaces already, then you could also just replace the <h:form> by <o:form> as follows (see also showcase example):
<o:form>
That's basically all. This will generate a <form action> with current query string included.
<form action="/app/agreement.xhtml?site=US&serviceId=AABBCC" ...>
Those request parameters are then just available in the request parameter map of the form submit. You don't need additional metadata/viewparams and you also don't need to send a redirect and your bean can be kept #RequestScoped, if necessary.
public String generateMethod() {
// ...
return "generated";
}
See also:
What can <f:metadata>, <f:viewParam> and <f:viewAction> be used for?
How to navigate in JSF? How to make URL reflect current page (and not previous one)
Your generateMethod would have to return
return "generated?site=US&serviceId=AABBCC&faces-redirect=true";
You can even replace & with & but escape it in your xhtml.
In your generated.xhtml you can catch the parameters that are being passed with <f:viewParam> like this
<f:metadata>
<f:viewParam name="site" value="#{yourBean.site}"/><!--Make sure you have a setter-->
<f:viewParam name="serviceId" value="#{yourBean.serviceId}"/><!--Make sure you have a setter-
</f:metadata>
<h:head>
I am using JSF2, and I need to be able to pass a parameter from one JSF page to another via a commandLink.
I am on page funding.xhtml (ViewScoped) and have the following link defined:
<p:commandLink styleClass="toolbar"
action="/application/customerApplicationManagement.jsf">
<p:graphicImage url="/resources/gfx/search.png" />
<h:outputText value="#{msg.menu_searchApplications}" styleClass="toolbarLink" />
</p:commandLink>
I need to pass a string value to the customerApplicationManagement page indicating which page I came from so that after selecting an application, I can return to that page. I have tried several suggestions about how to pass this value including f:param, f:viewParam. I have even tried just adding it directly to the url (?fromPage=funding) etc, but they all seem to work only when the value is passed back to the current page, not a new page I am navigating to.
Can someone show me how this can best be accomplished.
Use <f:param> and <f:viewParam>:
Source page:
<p:commandLink styleClass="toolbar"
action="/application/customerApplicationManagement.jsf">
<p:graphicImage url="/resources/gfx/search.png" />
<h:outputText value="#{msg.menu_searchApplications}" styleClass="toolbarLink" />
<f:param name="fromPage" value="funding.xhtml" />
</p:commandLink>
Destination page (bound):
<f:metadata>
<f:viewParam name="fromPage" value="#{destinationBacking.fromPage}" />
</f:metadata />
<h:link value="Go back!" outcome="#{destinationBacking.fromPage}" />
Destination page (unbound):
<f:metadata>
<f:viewParam name="fromPage" />
</f:metadata />
<h:link value="Go back!" outcome="fromPage" />
Backing bean (only if you want to bind the param):
#ManagedBean
#ViewScoped
public class DestinationBacking{
String fromPage;
public String getFromPage(){
return fromPage;
}
public void setFromPage(String frompage){
fromPage = frompage;
}
}
Your view path will be binded to fromPage property from the destination backing bean and after you can use it to return to the original page.
Also I want to say that this way is a bit 'hackeable' by the end user, I mean, you're passing the original path through pure url. See also other ways to achieve that, as flash scope, which is very useful specially if you're working with #ViewScoped beans.
I don't know the specifics of the methods you tried to achieve your goal and hence we cant tell what was wrong with them, but if we consider your code 'as is' you don't have anything that will pass the string you want.
Not to repeat ourselves, there are plenty of answers here dedicated to using this or that method, so I will give you the best references, in my opinion, of course.
How can I pass a parameter to a commandlink inside a datatable;
ViewParam vs #ManagedProperty;
What can <f:metadata> and <f:viewParam> be used for.
Regarding the usage of back buttons in JSF you could also take a look at my own answer on How to get back to the same page in JSF.
By the way, using POST for page-to-page navigation is considered to be a bad practice. If all you need is to navigate to another page you'd better use plain <h:link> or <h:button> instead.
I have simple jsf page with view params and load method which is processing those params:
<f:metadata>
<f:viewParam name="param1" value="#{bean.param1}"/>
<f:viewParam name="param2" value="#{bean.param2}"/>
<f:viewParam name="param3" value="#{bean.param3}"/>
<f:event type="preRenderView" listener="#{bean.load()}"/>
</f:metadata>
I also set some initial values in #PostConstruct.
How to redirect user to new location that include those parameters (which are not null).
For example user enter in browser:
domain.com/page.jsf
and is redirected to:
domain.com/page.jsf?param1=valueA
because param1 was set in #PostConstruct.
Another question - I have links on page referencing same view:
<h:link value="clickme">
<f:param name="param3" value="otherValue"/>
</h:link>
When user enters page with ?param1=someValue and clicks link, got redirected to ?param3=otherValue but I want to redirect to ?param1=someValue¶m3=otherValue.
I know I can add more parameters in <h:link> but it's diffucult to add every possible param in every <h:link>
PS. I use BalusC tip from this topic JSF 2 and Post/Redirect/Get?
As to the 1st question: you can add includeViewParams=true to the navigation case outcome. But you can never guarantee that you'll sucessfully be redirected while you're doing that inside a preRenderView method. It might be already too late then.
As to the 2nd question: you can set the includeViewParams attribute of <h:link> to true.
<h:link value="clickme" includeViewParams="true">
<f:param name="param3" value="otherValue"/>
</h:link>
Alternatively, you can also add includeViewParams=true to the outcome.
<h:link value="clickme" outcome="otherPage?includeViewParams=true">
<f:param name="param3" value="otherValue"/>
</h:link>