I am trying to invoke a Save method in a bean with Openfaces 3. While Firefox is not rendering the page, Internet Explorer does.
I'm currently using this code lines:
<o:commandLink value="Save" action="#{beanX.save}">
<h:graphicImage url="/images/save_48.png" />
</o:commandLink>
but I was trying o:ajax as well:
<o:commandLink value="Save" action="#{beanX.save}">
<h:graphicImage url="/images/save_48.png" />
<o:ajax event="click" render="#none" />
</o:commandLink>
Any ideas?
I've found a way to deal with using standard JSF components. Any ideas how to solve this issue with o:commandLink?
You can use <f:ajax> and render attribute in jsf2.0
<h:form>
<h:inputText value="#{managedBean.val1}" >
<f:ajax event="keyup" render="result" listener="#{managedBean.someThingToDoListener}"/>
</h:inputText>
<h:inputText value="#{managedBean.val2}" >
<f:ajax event="keyup" render="result" listener="#{managedBean.someThingToDoListener}"/>
</h:inputText>
<h:outputText id="result" value="#{managedBean.result}"/>
</h:form>
#ManagedBean(name = "managedBean")
public class Bean {
private String val1; // getter and setter
private String val2; // getter and setter
private String res; // getter and setter
...
public void someThingToDoListener(AjaxBehaviorEvent event) {
//res = some processing
}
}
Also See
how-to-update-a-value-displayed-in-the-page-without-refreshing
JSF2: Ajax in JSF – using f:ajax tag
Thank you Jigar Joshi. You've given me the key hint. It works with this code lines:
<h:commandLink value="Save">
<h:graphicImage url="/images/save_48.png" />
<f:ajax event="click" render="#none" listener="#{beanX.save}" />
</h:commandLink>
I've been to this website before, I was not thinking in assuming that o:commandLink might not be able to handle this, might be a bug?
Using h:commandLink instead of o:commandLink and f:ajax with the listener attribute solved my problem.
Related
I have a dynamic dataTable that adds and removes objects. This works fine when I don't use ajax. However, when I use ajax, a problem occurs. Adding values initially is fine. However, when I start deleting objects, when I delete the last object, the items list gets deleted as well and becomes null. I am using jsf 2.2 with primefaces. I'm not sure what's causing this problem. My code is as follows.
item.xhtml
<h:panelGroup id="list">
<h:dataTable value="#{item.items}" var="object">
<h:column>
<!-- Figure out what these facets are or delete them -->
<f:facet name="keys">Keys</f:facet>
<p:inputText value="#{object.x}" />
</h:column>
<h:column headerText="Values">
<f:facet name="values">Values</f:facet>
<p:inputText value="#{object.y}" />
</h:column>
<h:column>
<h:commandLink value="Delete" action="#{user.removeObject(object)}">
<f:ajax execute="#form" render="#form" />
</h:commandLink>
</h:column>
</h:dataTable>
<h:commandButton value="add" action="#{user.addObject}">
<f:ajax execute="#form" render="#form" />
</h:commandButton>
</h:panelGroup>
item.java
#ManagedBean
#ViewScoped
public class Item implements Serializable{
public void addObject(){
Pair<String,String> tempPair = new Pair<String,String>("","");
items.add(tempPair);
return;
}
public void removeObject(Pair<String,String> i){
items.remove(i);
return;
}
}
UPDATE 1
I tried using jsf 2.1 instead, changing my viewAction to preRenderView, and my code works fine.
I think ajax is missing update properties. Try this:
<f:ajax execute="#form" render="#form" update="#form"/>
This is a bug in jsf 2.2.0. I replaced javax-faces-2.2.0.jar with javax-faces-2.2.1.jar and the issue disappeared.
Alternatively, another solution is to replace the <f:ajax> above with:
<f:ajax execute="#form" render=":form:list">
Apparently, the ajax call works fine in jsf 2.2.0 as long as the the whole form is not rendered.
We have a old application running with JSF 1.1, cannot upgrade due to client specification.
I would like to know is it possible to have a datatable with JSF 1.1 and upon clicking a button or link in datatable row open a dialog popup and do CRUD operation?
Thanks
Edit 1
I guess Apache Trinidad supports JSF 1.1. Can I do CRUD operation with Trinidad?
I think using Richfaces 3.1.6 (JSF 1.1 compatible) with the great A4J, will help you doing so:
<h:form id="myForm">
<rich:dataTable width="100%" style="border:none;margin-left:15px;" id="tableId" columnClasses="colClass"
value="#{managedBean.someList}" var="someVar">
<h:column> some content for this column </h:column>
<h:column>
<a4j:commandLink styleClass="linkClass" value="Delete" reRender="myForm:myModal" ajaxSingle="true" oncomplete="#{rich:component('myForm:myModal')}.show()" actionListener="#{managedBean.someMethodToUpdateDTO}">
<a4j:actionparam value="#{someVar.idForExample}" name="someName" assignTo="#{managedBean.someDTOObjectToBeUpdated.id}"/>
</a4j:commandLink>
</h:column>
</rich:dataTable>
<rich:modalPanel id="panel" width="350" height="100">
<f:facet name="header">
<h:panelGroup>
<h:outputText value="Are you really, really sure to delete this one!!! #{managedBean.someDTOObjectToBeUpdated.name}"></h:outputText>
</h:panelGroup>
</f:facet>
<a4j:commandButton styleClass="btnClass" value="Oui" ajaxSingle="true" oncomplete="#{rich:component('myForm:myModal')}.hide()" reRedner="myForm:tableId" action="#{managedBean.deleteIt}">
</rich:modalPanel>
</h:form>
someMethodToUpdateDTO is a method, in your managed bean that looks like this:
public void someMethodToUpdateDTO(ActionEvent event){
//In this method I just load the object from somewhere else
someDTOObjectToBeUpdated = someDAO.getObject(someDTOObjectToBeUpdated.getId());
//someDTOObjectToBeUpdated is an attribute of your managed bean, of course with its getter and setter
}
Hope this helps,
Cheers
hi chums I am new to JSF and I got stuck in JSF problem.I want to add dynamically my content in my JSF page.My requirment is that I have one facelets which I have to add in my page after some event.
My page contains
two fields 'user name' and 'answer'
and
two buttons 'login' and 'recover password'
Facelet contains
a field and just a button
Now I want that when I run my this page it should show only Page contents(described above)
and if user press the button 'recover password' then it should show the facelet under the components of page on the same page mean after pressing the button , page could include facelet.
But now when I run my code it show both as I haven't put any logic to add 2nd facelet dynamically.Here a patch of my code given below
<h:inputText id="txtLogin" styleClass="textEntry" required="true" requiredMessage="Username is required.">
</h:inputText>
<h:inputText id="answer" styleClass="textEntry" autocomplete="off" required="true" requiredMessage="Answer is required."></h:inputText>
<h:commandButton id="btnSave" value="Save" styleClass="formbutton" onclick="btnSave_Click" />
<h:commandButton id="btnRecover" value="Recover" styleClass="formbutton" onclick="btnRecover_Click"/>
Now I want when this btnRecover_click click then it include this facelet or run this code
<div class="divPadding">
<ui:include id="passrecov" src="ucPasswordRecovery.xhtml" rendered="false"/>
</div>
Keep in mind that I have to do this with JSF and don't want to do this with JavaScript
Thanks
I'll post a sample using with 1 column, remember that you could use another ui container.
<h:form>
<h:panelGrid id="login">
<h:panelGrid>
<h:inputText id="txtLogin" styleClass="textEntry" required="true"
requiredMessage="Username is required.">
</h:inputText>
<h:inputText id="answer" styleClass="textEntry" autocomplete="off"
required="true" requiredMessage="Answer is required.">
</h:inputText>
<h:commandButton id="btnSave" value="Save" styleClass="formbutton"
onclick="btnSave_Click" />
<h:commandButton id="btnRecover" value="Recover" styleClass="formbutton"
action="#{loginBean.showPassRecovery}" />
</h:panelGrid>
</h:panelGrid>
<h:panelGrid id="passRecovery">
<h:panelGrid rendered="#{not loginBean.loginEnabled}">
<ui:include id="passrecov" src="ucPasswordRecovery.xhtml" />
</h:panelGrid>
</h:panelGrid>
</h:form>
And your managed bean:
#ManagedBean
#ViewScoped
public class LoginBean {
private boolean loginEnabled;
public LoginBean() {
loginEnabled = true;
}
//getters and setters...
//this method will return void, so the page will be refreshed with the new
//loginEnabled value. this time the components inside "login" panelGrid won't be rendered
//but "passRecovery" panelGrid components will.
public void showPassRecovery() {
loginEnabled = false;
}
}
I'm trying to get a little application working using Seam 3, RichFaces 4 and hitting a few troubles with passing some parameters around. I've tried a lot of different things but I keep falling at the final hurdle. I'm carrying through a customerId via a request parameter. But when I hit a RichFaces commandButton on a popupPanel, that customerId is no longer available to me.
I'm setting up an application to manage some data. Basically you select a customer from one screen, that will take you to another screen containing "repositories" where you then can create, edit etc. You can get to this second repositories page via the URL:
http://localhost:8080/media-manager/repositories.xhtml?customer=12
I then have a bean picking this value up:
#Named
#RequestScoped
public class RepositoryBean extends AbstractViewBean<Repository> {
// Various properties etc. here
private Long customerId;
public void init() {
log.info("Customer ID is "+ customerId);
}
}
I then set the customer ID via metadata on the repository page and call init:
<f:metadata>
<f:viewParam name="customer" value="#{repositoryBean.customerId}"/>
<f:event type="preRenderView" listener="#{repositoryBean.init}" />
</f:metadata>
This works well at the start. I can display information I need for the customer with the supplied ID. But when I try to create my popupPanel is goes a bit wrong. Here's a simplified version of the code first:
<rich:popupPanel id="repositoryModalPanel" modal="true" resizeable="true">
<f:facet name="header">Title</f:facet>
<f:facet name="controls">
<h:outputLink value="#" onclick="#{rich:component('repositoryModalPanel')}.hide(); return false;">X</h:outputLink>
</f:facet>
<h:form id="modalForm" class="modalForm">
<fieldset>
<ul class="layout form">
<li>
<label for="name" class="required">Name:</label>
<h:inputText id="name" value="#{repositoryBean.instance.name}" required="true">
<!-- rich:validator event="blur" / -->
</h:inputText>
<rich:message for="name" errorClass="error errormessage" />
</li>
<li class="last">
<a4j:commandButton id="create" value="Create" action="#{repositoryBean.saveRepository}" rendered="#{empty repositoryBean.instance.id}"/>
<a4j:commandButton id="save" value="Save" action="#{repositoryBean.saveRepository}" rendered="#{not empty repositoryBean.instance.id}"/>
<a4j:commandButton id="cancel" value="Cancel" action="#{repositoryBean.clearInstance}" immediate="true" />
</li>
</ul>
</fieldset>
</h:form>
Basically, whenever I hit the save commandButton, the init method is called but the customerId member is never populated. Does anyone have any insight into why?
I've read that viewParam is only for GET requests so maybe that's the problem? But if that's the case - what is the other solution? Lots of things I have seen suggested (e.g. using #ManagedProperty) does not seem to be applicable to Seam 3.
RepositoryBean is RequestScoped, and as such will be newly created on each request, especially if you hit the save button.
The straightforward solution is to promote RepositoryBean to be ConversationScoped, and to make it long running if you enter the page.
#Named
#ConversationScoped
public class RepositoryBean extends AbstractViewBean<Repository> {
// Various properties etc. here
#In
Conversation conversation
private Long customerId;
public void init() {
log.info("Customer ID is "+ customerId);
conversation.begin();
}
}
The easieast way for that is to dump the preRenderView and use seam 3 view-action instead.
<f:metadata>
<f:viewParam name="customer" value="#{repositoryBean.customerId}"/>
<s:viewAction action="#{repositoryBean.init}" if="#{conversation.transient}"/>
</f:metadata>
I have to make a sort of switch of some panelGroup UI.
About the view section, i made this :
<h:panelGroup layout="block" id="profile_content">
<h:panelGroup layout="block" styleClass="content_title">
Profilo Utente
</h:panelGroup>
<h:panelGroup rendered="#{selector.profile_page=='main'}">
<ui:include src="/profile/profile_main.xhtml" />
</h:panelGroup>
<h:panelGroup rendered="#{selector.profile_page=='edit'}">
<ui:include src="/profile/profile_edit.xhtml" />
</h:panelGroup>
<h:panelGroup rendered="#{selector.profile_page=='insert'}">
<ui:include src="/profile/profile_articles.xhtml" />
</h:panelGroup>
</h:panelGroup>
Now, to change this value, i written an exclusive JavaBean, called Selector :
#ManagedBean(name="selector")
#RequestScoped
public class Selector {
#ManagedProperty(value="#{param.profile_page}")
private String profile_page;
public String getProfile_page() {
if(profile_page==null || profile_page.trim().isEmpty()) {
this.profile_page="main";
}
return profile_page;
}
public void setProfile_page(String profile_page) { this.profile_page=profile_page; }
}
So, right now succeeds my problem : when i change the "context" by using some h:commandButton, i'd like to use asynch call to the server. This is my Button Panel :
<h:commandButton value="EDIT">
<f:ajax event="action" execute="???" render=":profile_content"/>
</h:commandButton>
<h:commandButton value="PM">
<f:ajax event="action" execute="???" render=":profile_content"/>
</h:commandButton>
<h:commandButton value="ARTICLES">
<f:ajax event="action" execute="???" render=":profile_content"/>
</h:commandButton>
I don't know what to put on execute, so that i edit the Beans value and i change the context by using render=":profile_content"
Hope this question is comprehendible. Forgive me about language :)
Cheers
Use f:setPropertyActionListener. You don't need to override the default of f:ajax's execute attribute (which is #this, the sole button).
E.g.
<h:commandButton value="EDIT">
<f:setPropertyActionListener target="#{selector.profile_page}" value="edit" />
<f:ajax event="action" render=":profile_content"/>
</h:commandButton>
Note that the Java Coding Conventions recommends CamelCase over under_score. I'd suggest to fix profile_page to be profilePage. This is Java, not PHP.