problem with listshuttle in modalpanel
Good day, people.
I'm having an application that uses richfaces 3.3.3.final.
found out a problem with using listshuttle component.
here is description:
There's an 1.xhtml page with the list of account data. Also there are modal panels for editing and adding a new account.
The point is that a modalpanel for editing should appear when a user points to the specific account(and every input component should have the data to edit).
When I click on a specific account the modalpanel appears(and account data in the input components appears too) but if I click on a submit button - nothing happens. The function in the 'action' parameter of the 'a4j:commandButton' component is not called.
Here is the code:
modalpanel:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
xmlns:s="http://jboss.com/products/seam/taglib"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:rich="http://richfaces.org/rich"
xmlns:a4j="http://richfaces.org/a4j">
<rich:modalPanel id="edit_account_modal_panel"
autosized="true" resizeable="false">
<f:facet name="header">
<h:panelGroup>
<h:outputText value="Editing user"></h:outputText>
</h:panelGroup>
</f:facet>
<f:facet name="controls">
<h:panelGroup>
<a4j:commandButton value="close" onclick="#{rich:component('edit_account_modal_panel')}.hide();" />
</h:panelGroup>
</f:facet>
<h:form>
<!--<a4j:outputPanel ajaxRendered="true" >-->
<h:panelGrid cellspacing="2px" >
<h:panelGrid columns="2" cellspacing="2px" >
<h:outputText value="Name: " style="font-weight: bold;" />
<h:inputText value="#{UsersDataController.editUser.name}"
id="modal_edit_name" style="width:350px;" >
<!--<rich:beanValidator summary="wrong name format" />-->
</h:inputText>
<h:outputText value="" />
<rich:message for="modal_edit_name" >
<f:facet name="errorMarker">
<h:graphicImage value="/Images/error.gif" />
</f:facet>
</rich:message>
<h:outputText value="Password: " style="font-weight: bold;" />
<h:inputSecret value="#{UsersDataController.editUser.password}"
id="modal_edit_password" style="width:350px;" >
<!--<rich:beanValidator summary="wrong password format" />-->
</h:inputSecret>
<h:outputText value="" />
<rich:message for="modal_edit_password">
<f:facet name="errorMarker">
<h:graphicImage value="/Images/error.gif" />
</f:facet>
</rich:message>
<h:outputText value="Type: " style="font-weight:bold;" />
<h:selectOneMenu id="modal_edit_type_combo" style="width:350px;"
value="#{UsersDataController.editUser.role}">
<f:selectItems value="#{UsersDataController.roles}"
var="item" itemValue="#{item.id}"
itemLabel="#{item.name}"/>
</h:selectOneMenu>
<h:outputText value="" />
<rich:message for="type_combo">
<f:facet name="errorMarker">
<h:graphicImage value="/Images/error.gif" />
</f:facet>
</rich:message>
</h:panelGrid>
<h:outputText value="Account traders:" style="font-weight:bold;" />
<rich:listShuttle sourceValue="#{UsersDataController.freeTradersToSelect(UsersDataController.editUser.traders)}"
targetValue="#{UsersDataController.editUser.traders}"
var="item" id="modal_edit_traders_list"
converter="#{TraderConverter}"
sourceCaptionLabel="Available traders"
targetCaptionLabel="Selected traders" >
<rich:column>
<h:outputText value="#{item.name}" />
</rich:column>
</rich:listShuttle>
<h:outputText value="" />
<rich:message for="traders_list">
<f:facet name="errorMarker">
<h:graphicImage value="/Images/error.gif" />
</f:facet>
</rich:message>
</h:panelGrid>
<!--</a4j:outputPanel>-->
<table width="100%">
<tbody>
<tr>
<td align="center" width="50%">
<a4j:commandButton value="Save"
action="#{UsersDataController.doEditAccount}"
reRender ="table_bo"
oncomplete="#{rich:component('edit_account_modal_panel')}.hide();" />
</td>
<td align="center" width="50%">
<a4j:commandButton value="Cancel"
action="#{UsersDataController.clearEditUser}"
onclick="#{rich:component('edit_account_modal_panel')}.hide();return false;" />
</td>
</tr>
</tbody>
</table>
</h:form>
</rich:modalPanel>
</ui:composition>
backing bean:
public class UsersDataController implements Serializable
{
private List<Role> roles = new ArrayList<Role>();
// all traders are here
private List<Trader> traders = new ArrayList<Trader>();
// all users are here
private List<User> users = new ArrayList<User>();
// User to create
private User editUser = new User();
...
constructor + all getters + all setters
...
public void doEditAccount()
{
System.out.println("editing account id=" + editUser.getId() +
", name=" + editUser.getName() +
", pass=" + editUser.getPassword() +
", roleId=" + editUser.getRole() +
", traders=" + editUser.getTraders().size());
editUser.setName(editUser.getName().toLowerCase());
storage.doEditAccount(editUser);
reloadUsersData();
}
// this method converts the ArrayList with Traders into the Set with traders.
public Set<Trader> arrayListToSet(ArrayList<Trader> traders)
{
Set<Trader> tempSet = new HashSet<Trader>(traders);
return tempSet;
}
// this method prepares the list of the traders that are not added yet.
public List<Trader> freeTradersToSelect(List<Trader> trd)
{
List<Trader> tTraders = new ArrayList<Trader>();
Integer count = 0;
for(Trader tr1 : traders)
{
count = 0;
for(Trader tr2 : trd)
{
if(tr1.getId() == tr2.getId())
{
break;
}
else
{
count++;
}
}
if(count == trd.size())
{
tTraders.add(tr1);
}
}
return tTraders;
}
}
the thing is:
0. if i press 'SAVE' button then modalpanel hides but action method isn't called.
1. if i remove 'listshuttle' component from the xhtml then all the code works ok(except of the needed info of the listshuttle component to be added).
2. if i place 'ajaxSingle=true' to the button for SAVING then 'action' parameter is called, but new data(that is edited) is not saved. saved is the old data(that is before editing).
Please, help in resolving this problem.
Thanks in advance.
