Primefaces wizard move to the next tab on an event - jsf

I have a prime faces wizard and a dataTable, my page successfully go to the next wizard tab if I selected an item from the dataTable, but my problem is when inserting a new data to the dataTable I want the wizard to go to the next tab if the insert was successful, any suggestions please?

You can use the client side API from backing bean, after the insert was successful.
Add a widgetVar to your wizard
<p:wizard widgetVar="wiz" ...>
...
<p/wizard>
Add the client execute, after the data is successfully inserted.
public void insertData() {
// Insert data
if (successfully) {
RequestContext context = RequestContext.getCurrentInstance();
context.execute("PF('wiz').next()");
}
}

Related

Partial Page Refresh is not working in Oracle ADF

I have a button in JSF page which when clicked calls a method in the bean and return me all the rows present in the table. But when I am clicking the button the table is not getting refreshed. I am using a return listener in the button and binded the table with it.
<f:facet name="additionalToolbarButtons">
<af:toolbar>
<af:commandToolbarButton text="ShowAll"
actionListener="#{backingBeanScope.Bean.showAllRows}"
returnListener="#{backingBeanScope.Bean.refreshTable}"/>
</af:toolbar>
</f:facet>
Table binding -
binding="#{backingBeanScope.Bean.refreshTable}">
Java Code -
public void refreshTable(ReturnEvent returnEvent) {
// Add event code here...
AdfFacesContext ctx = AdfFacesContext.getCurrentInstance();
ctx.addPartialTarget(getRefreshTable());
}
public RichTable getRefreshTable() {
return refreshTable;
}
When I am manually refreshing the page then I can see all the rows in table. I have recently started working in ADF. Can someone please guide me
Which exact version of JDev you are using?
Try to ppr the parent of the table.

How to add pe:badge to dynamically created menu in bean using PrimeFaces

I’m rewriting static menu to dynamic, since our customer wants to dynamically change the menu on the fly. Before that I had standard <p:menu> <p:menuItem> </p:menu> structure in my xhtml.
But now I have changed it to:
<p:menu model="#{pageTemplateView.menuModel}"/>
And I’m creating model in my backing bean like this:
DefaultMenuItem menuItem = new DefaultMenuItem();
menuItem.setIcon(item.getIcon());
menuItem.setTarget(item.getLink());
menuItem.setValue(item.getName());
But the problem is I don’t know how to add <pe:badge> component inside menu item from bean.
Before that I included badges to menus the following way:
<p:menuitem id="tasks_icon_menuitem_id" icon="fa fa-tasks" url="#">
<pe:badge content="#{badgeCountBean.badgeCount()}"/>
</p:menuitem>
So how do I add <pe:badge> to dynamically created menu in bean?
I'm using PrimeFaces 8
After few hours of testing and plying around I found the issue that prevents me from adding badge to default menu item.
The issue is when you try to add child to DefaultManuItem like this:
Badge badge = new Badge();
DefaultMenuItem defaultMenuItem = new DefaultMenuItem();
defaultMenuItem.getChildren().add(badge);
You get unsupported operation exception since DefaultMenuItem:: getChildren() is implemented like this:
public List<UIComponent> getChildren() {
return Collections.emptyList();
}
But I have found an ugly workaround for this issue. So I might share it and maybe well get to better solution eventuality.
In my xhtml I added empty menu and gave it fixed ID like this:
<!-- MENU PLACEHOLDER -->
<p:menu id="dynamic_menu_placeholder"/>
<!-- need to add dummy badge to xhtml otherwise it wont be displayed -->
<pe:badge/>
And then in my bean I got the component by ID and added UIMenuItem elements to it like this:
// get component by ID
UIComponent component = FacesContext.getCurrentInstance().getViewRoot().findComponent(":form:dynamic_menu_placeholder");
Menu menu = (Menu) component;
menu.getChildren().clear();
for (MenuItem item : menuItemList) {
// creating menu item
UIMenuItem menuItem = new UIMenuItem();
menuItem.setUrl(item.getLink());
menuItem.setValue(item.getValue());
menuItem.setId(... generated some id);
// creating badge
Badge badge = new Badge();
badge.setContent(...getBadgeCount()..);
// adding badge to menu item
menuItem.getChildren().add(badge);
}
// addin menu item to menu
menu.getChildren().add(menuItem);

Dynamic primefaces menuItem don't fire command

Environment:
Java 7
Jboss 5.2
Primefaces 6.2
The problem I get is that when I click on the menu item the command does not fire the themeSwitcherBean.changeToOld method. What is wrong?
MenuModel menu = new DefaultMenuModel();
Create Menu
...
for (Iterator<Menu> it = children.iterator(); it.hasNext(); ) {
Menu subMenu = (Menu) it.next();
String index = subMenu.getCodi();
String element = rootCodi + index;
DefaultMenuItem menuItem = new DefaultMenuItem(menuName);
menuItem.setId(element);
menuItem.setUrl(subMenu.getServletPath());
menuItem.setCommand("#{themeSwitcherBean.changeToNew}");
menuItem.setUpdate(":content");
rootNode.addElement(menuItem);
}
menu.addElement(rootNode);
...
Menu.xhtml
<h:form id="frmMenu">
<pu:menu model="#{sessionBean.menu}">
</h:form>
If you set an URL to a menuItem.url property it is rendered as a simple hyperlink using href.
Clicking on this results in the browser to navigate to the given URL and request it using GET rather than doing a POST request optionally using AJAX.
This finally will not update ":content" the AJAX way and not invoke your themeSwitcherBean.changeToNew action method.
In order to have your action method invoke you have to skip that line:
menuItem.setUrl(subMenu.getServletPath());
If you find you need to reload the entire page (which is likely when switching themes) instead of the element referenced using ":content" only, make your action method return that instruction as String:
public String changeToNew() {
// do something ...
// ...
String viewId = FacesContext.getCurrentInstance().getViewRoot().getViewId();
return viewId + "?faces-redirect=true&includeViewParams=true";
}
In this case you can disable AJAX on that menu item reducing the request/response/javaScript overhead a little bit:
menuItem.setAjax(false);

Primefaces refreshing dataTable on modal dialog commandButton click

I have dataTable for editing users.
I have commandLink in each row for opening modal dialog with selected user data for editing.
On that dialog I have commandButton for saving user.
I have a problem refreshing dataTable and displaying new edited values for user.
<p:commandButton value="Save" action="#{usersBean.updateUser()}" onclick="PF('editUserDlg').hide();" update=":adminForm:adminTabView:usersDataTable" styleClass="ui-priority-primary" style="float: right;" />
I followed BalusC answer on subject finding out id of component and have no errors in server log.
When I click on Save button I call backing bean method:
public void updateUser() {
int userId = selectedUserView.getId();
User user = adminSessionBean.getMe(userId);
try {
updateUser(user);
LOG.info("User seccessfully updated.");
} catch (Exception exc) {
String message = "Error updating user: " + exc.getMessage();
LOG.error(message);
FacesContext.getCurrentInstance().addMessage(null, new FacesMessage(FacesMessage.SEVERITY_INFO, message, null));
}
}
and edited user is saved correctly (I've checked in database). Problem is that I don't see new edited user values in dataTable after modal dialog is closed.
When I refresh page I see new values for user.
When I add call #PostConstruct init() method after updateUser(user); I see the changed values in dataTable, but I am not sure if this is the correct approach.
Thanks Kukeltje,
I'll go with calling init() after updateUser() method.
I wouldn't call the init method, this method should only be called after the bean is constructed as the annotation states.
Try calling a remoteCommand instead of closing your dialog directly which refreshes the dataTable. After that you could close the dialog from that command. Something like this.
<p:remoteCommand name="updateContent" update="table"
oncomplete="PF('dialog').hide();" />
Didn't tried this solution directly, but I think that should work. I used this approach for a similar problem.
EDIT: As Kukeltje states, you also have to refresh your dataModel so that the dataTable receives the new data. You could add an actionListener to the remoteCommand to do that.

richfaces text and text area on rerender unable to use keyboard up and down arrow keys to move the cursor

I am using RichFaces 3.3.2 and JSF 1.2.
Scenario:
In my application when the user enters some text in a text field or a text area we have to enable the apply button. For this we are using rerender 'onkeyup' event.
Validation error mesage should be shown when user enters invalid date
JSF Page code:
<h:inputText id="input" required="true" requiredMessage="Value cann't be null"
value="#{client.Value}" validatorMessage="Value should be between 0 and 999999999999.99" valueChangeListener="#{myHandler.onChange}" maxlength="30">
<f:validateDoubleRange minimum="0" maximum="999999999999.99"/>
<a4j:support event="onkeyup" eventsQueue="A4JQueue" reRender="outputPanel_btn_save"></a4j:support>
Apply button code:
<a4j:outputPanel id="outputPanel_btn_save">
<a4j:commandButton value="#{msg.btn_Apply}" id="applyButton" reRender="outputPanel_btn_save" eventsQueue="A4JQueue" disabled="#{myHandler.isApplyButtonDisabled}" styleClass="button" action="#{myHandler.update}">
</a4j:commandButton>
</a4j:outputPanel>
Backing bean code for myHandler.onChange()
MyHandler {
public void onChange(ValueChangeEvent event) {
Iterator<FacesMessage> facesMessages = getFacesContext().getMessages();
boolean isMessagePresent=false;
while(facesMessages.hasNext()){
FacesMessage message = facesMessages.next();
isMessagePresent=true;
break;
}
if (event != null
&& event.getNewValue() != event.getOldValue()&& !isMessagePresent) {
this.isApplyButtonDisabled = Boolean.FALSE;
}
if(isMessagePresent){
this.isApplyButtonDisabled = Boolean.TRUE;
}
}
}
Problem:
When the user enters some text onkeyup event we are rerendering the apply button. Due to rerender keyboard arrow keys are not working as the field is loosing it's focus onKeyup event.
I tried using JS to enable the apply button, when user enters some text. But then JSF validations are not being executed and no validation message are being displayed.
Question:
Can you suggest a way to enable the apply button with out loosing focus on the text field / text area and also JSF validations should be executed / displayed?
Try using focuc attribute on a4j:support. It allows to set focus on a component after Ajax request.

Resources