I have two buttons and I have to navigate through these nodes TreeNode in my tree.
My idea is to update the SelectedNode at each iteration the user with the buttons. But the update does not work properly and the SelectedNode remains one selected with the click. How can I do this properly?
myBean(){
...
private TreeNode selectedNode;
private TreeNode navigazione;
//Getter and Setter
.......
public void navigate(){
if(getSelectedNode!=null && getSelectedNode().getChildCount()>0){
navigazione=getSelectedNode().getChildren().get(0);
System.out.print(getNavigazione().getChildCount()+getNavigazione().getData().toString());
setSelectedNode(navigazione);
}
return;
}
xhtml portion
p:panel id="navTree" style="border:none; background:transparent; align:left"
p:commandButton icon="ui-icon-arrowthick-1-n" disabled="false" ajax="true"
actionListener="#{myBean.navigate}">/p:commandButton>
Note that the tags are opened and closed properly and not as here to display problems
Thanks!
Related
I want to set multiple child nodes under same parent to be selected or check marked. I saw this answer: https://stackoverflow.com/a/17025086/1297935 and tried the following and it does not work:
#ManagedBean
#ViewScoped
public class BackingBean extends GenericViewBean {
private TreeNode[] selectedNodes;
public void showChildSelected(){
...
...
selectedNodes = new TreeNode[]{p1child1,p1child2}; //two child nodes of same parent added
...
...
for(TreeNode treeNode : selectedNodes){
treeNode.setSelected(true);
}
RequestContext.getCurrentInstance().update("listView:tree");
}
}
Above code only shows the last child selected / check marked. Is there any Solution to select multiple child nodes of the same parent from Managed Bean?
Thanks in advance.
I think it seems to be some bug in Primefaces as the TreeNode[] selectedNodes in the Managed Bean properly shows 2 selected nodes but in the Javascript object PrimeFaces.widgets.treeWidget.selections array shows only one rowKey. This happens only when 2 children of the same parent are selected. And even after manually selecting the treenode using setSelected(true) in Managed Bean there is no change in Behaviour.
Currently i am using a Javascript workaround posted by alexSunder: https://stackoverflow.com/a/25716716, in his post he is using PrimeFaces.widgets.treeWidget.selectNode(node,silent) but i had a look at the tree.js and got another method for checkboxes: PrimeFaces.widgets.treeWidget.toggleCheckboxNode(node). Following is the change i did and it is working!!
#ManagedBean
#ViewScoped
public class BackingBean extends GenericViewBean {
private TreeNode[] selectedNodes;
public void showChildSelected(){
...
...
selectedNodes = new TreeNode[]{p1child1,p1child2}; //two child nodes of same parent added
...
...
for(TreeNode treeNode : selectedNodes){
StringBuilder sb = new StringBuilder();
sb.append("PrimeFaces.widgets.treeWidget.toggleCheckboxNode(");
sb.append("$(\"#listView\\\\:tree\\\\:");
sb.append(treeNode.getRowKey());
sb.append("\"))");
RequestContext.getCurrentInstance().execute(sb.toString());
}
RequestContext.getCurrentInstance().update("listView:tree");
}
}
Method Description:
PrimeFaces.widgets.treeWidget.selectNode(node,silent): silent boolean parameter when passed as false, will not fire the Node Select Event, but does not change checkbox state, only selects/highlights the Node.
PrimeFaces.widgets.treeWidget.toggleCheckboxNode(node): check box state is toggled along with selecting of Node and then Node Select Event is fired.
This question already has answers here:
How to dynamically add and remove a tab in p:tabView component
(2 answers)
Closed 7 years ago.
I am programmatically add a new tab whenever a menu item is clicked. I have googled for all the questions on dynamic Tab creation and found a lot of unanswered queries. So my question is, is it possible to create tabs dynamically? Below is the code I am working on for the past week and not a tab in sight..
I am using Primefaces 5.0, JSF 2.2 Mojarra
Dynamic menu -
DefaultMenuItem windowItem = new DefaultMenuItem(node);
windowItem.setCommand("#{windowContainer.add}");
windowItem.setImmediate(true);
WindowContainer Backing Bean
#ManagedBean
#ViewScoped
public class WindowContainer implements Serializable {
private List<Window> windows;
#PostConstruct
public void init() {
windows = new ArrayList<Window>();
windows.add(new Window("window"+windows.size(),"first tab"));
}
public void add() {
windows.add(new Window("window" + windows.size(), "some content"));
RequestContext req = RequestContext.getCurrentInstance();
req.update("WindowContainer");
}
public void remove(Window window) {
windows.remove(window);
}
public List<Window> getWindows() {
return windows;
}
public void setWindows(ArrayList<Window> windows) {
this.windows = windows;
}
Windows is simple tab with only outputtext .
The View
<p:tabView id= "WindowContainer" value="#{windowContainer.windows}" var="window">
<p:tab title="#{window.title}">
<p>#{tab.content}</p>
<p:commandButton value="Close" action="#{windowContainer.remove(window)}" />
</p:tab>
</p:tabView>
<p:menu>
<p:submenu label="Ajax">
<p:menuitem value="Add Tab" actionListener="#{menuView.addTab}" update="WindowContainer" />
</p:menu>
Try like this update="WindowContainer" .Inside quotes give tabview id.
I want to create a primefaces menu component programmatically, here is the xhtml tag:
<p:menu model="#{notificationMenu.model}" />
and here is the spring component associated:
#Component
#Scope("session")
#Qualifier("notificationMenu")
public class NotificationMenu {
#Autowired
NotificationService notificationService;
private MenuModel model;
#PostConstruct
public void createMenuModel() {
List<Notification> listNotifs = notificationService.getAllUnreadNotifsForUser(LoginBean.getConnectedUser());
model = new DefaultMenuModel();
DefaultSubMenu subMenu = new DefaultSubMenu();
for (Notification notification : listNotifs) {
DefaultMenuItem item = new DefaultMenuItem();
item.setValue(notification.getTypenotification().getTypenotif());
item.setUrl("/user/index.xhtml");
subMenu.addElement(item);
}
model.addElement(subMenu);
}
public MenuModel getModel() {
return model;
}
}
I'd like to programmatically associated this menu to a graphical image (like a notification image), so that when the user click on the image the menu is shown... is it possible?
EDIT :
I want the menu to be displayed under the image and disappear on Blur (clicking outside the image).
Overlay Menu
A dynamic menu is created by setting overlay option to true and defining a trigger to show the
menu. Location of menu on page will be relative to the trigger and defined by my and at options
that take combination of four values:
left
right
bottom
top
That said:
<p:menu overlay="true" trigger="img"
my="left top"
at="bottom left"
model="#{notificationMenu.model}" />
<p:graphicImage id="img" />
I have a tabview on page and add tabs with javascript dynamically. At the same time add the opened tab names to a list(lstOpenedPages). But close a tab, I can't get name of this tab which is closed for delete from the list. Now I want to read remain tabs of tabview because I can find which tab is closed from the list (lstOpenedPages).
How to I get remain tabs of tabview in Javascript?
xhtml code
<p:tabView id="tw" widgetVar="tw">
<p:ajax event="tabClose" listener="#{MenuBean.onTabClose}"/>
</p:tabView>
<p:menuitem value="#{itemMenu.menuAck}"
action="#{MenuBean.OpenPage(itemMenu.pageName)}"
ajax="true"
oncomplete="handleTabViewEvent(args);"
/>
<script type="text/javascript">
function handleTabViewEvent(args) {
alert('Add tab here..');
}
</script>
bean
public void OpenPage(String pageName) {
lstOpenedPages.add(pageName);
}
public void onTabClose(TabCloseEvent event) {
FacesContext context = FacesContext.getCurrentInstance();
TabView tw = (TabView)context.getViewRoot().findComponent("centerForm:tw");
String s = "I must delete tab here from lstOpenedPages which closed. But event does not give me tab information. It is always null. So I must be delete from javascript";
}
I have Primefaces TabView with two Tab like:
<p:tabView dynamic="true" cache="false"
onTabShow="scrollBottom(#{stanzaBean.activeIndex})"
tabChangeListener="#{messaggioBean.onTabChange}"
activeIndex="#{stanzaBean.activeIndex}" >
it works fine, except that when I change the Tab the activeIndex isn't updated on the Server and it returns always the default value.
I'm using primefaces 2.2.1.
Thank you.
Going by the PrimeFaces ShowCase example, if you give each tab an id:
<p:tabView tabChangeListener="#{indexBean.onTabChange}" >
<p:tab title="tab 0" id="tab0"></p:tab>
<p:tab title="tab 1" id="tab1" ></p:tab>
<p:tab title="tab 2" id="tab2"></p:tab>
</p:tabView>
you can get that tab id in the tabChangeListener.
public void onTabChange(TabChangeEvent event) {
System.out.println("tab id = " + event.getTab().getId());
}
Then you'll know which tab was selected.
Edit:
There is an open PrimeFaces issue 1640 TabView: Wrong activeIndex in TabChangeListener, always 0 on the problem you are having.
Edit 2:
With PrimeFaces 5.0 and up the tabChangeListener is no longer available on the tabView element but should be used via an explicit ajax tag with a tabChange event.
<p:tabView id="analysisSections" value="#{analysisBean.analysis.sections}" var="section" activeIndex="#{analysisBean.activeIndex}">
<p:ajax event="tabChange" listener="#{analysisBean.onTabChange}"/>
Also you can directly get index of tab:
public void onTabChange(TabChangeEvent event) {
activeIndex = ((TabView) event.getSource()).getIndex();
}
with all these changes, activeIndex works properly.
this worked for me:
public void onTabChange(TabChangeEvent event) {
Tab activeTab = event.getTab();
tabPanelIndex = ((TabView)event.getSource()).getChildren().indexOf(activeTab);
}
Although the question was related to PrimeFaces 2.2.1, I like to mention that in modern PrimeFaces versions (tested with version 6.2) there is no need to trigger a separate event when attribute dynamic is set to true and cache is set to false. By using this attribute combination the active index is automatically updated on the server when another tab is selected.
Facelet:
<p:tabView activeIndex="#{stanzaBean.activeIndex}"
cache="false"
dynamic="true">
Bean:
#Named
#ViewScoped
public class StanzaBean implements Serializable {
private int activeIndex;
public int getActiveIndex() {
return activeIndex;
}
/**
* Automatically called whenever a tab changes and dynamic="true"
* and cache="false".
*/
public void setActiveIndex(int activeIndex) {
this.activeIndex = activeIndex;
// do other stuff when tab changes
}
}