Poll on topbar.... top menu doesn't open

Post Reply
fattanasio
Posts: 8
Joined: 23 Apr 2019, 10:16

05 Jul 2019, 10:03

Hi,
I have a problem. I do a poll into topbar to update messages and task activities. When it refresh, i try to open top menu but it doesn't work.... why ??
This is my code:

Code: Select all

<ui:composition 
    xmlns="http://www.w3.org/1999/xhtml"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:p="http://primefaces.org/ui">
    <p:poll autoStart="true" widgetVar="pollConteggioAttivita" interval="10" listener="#{utenteLoggato.pollContatoriGlobali}" update="panelList"></p:poll>	                
    	<div id="top-bar-wrapper">
	        <div id="top-bar">
	           
	  	<h:panelGroup id="panelList">
	            <div class="top-menu">
	                <div class="top-bar-icon">
	                    <a href="#">
	                        <i class="fa fa-bell-o animated swing" aria-hidden="true"></i>
	                        <h:panelGroup id="lblNum1" rendered="#{utenteLoggato.numAttivitaDaGestire>0}">
	                        	<i class="top-bar-badge animated rubberBand">#{utenteLoggato.numAttivitaDaGestire}</i>
	                        </h:panelGroup> 
	                    </a>
	                  
	                    <ul class="top-submenu animated flipInX">
	                        <li class="header">Hai #{utenteLoggato.numAttivitaDaGestire} tasks da gestire</li>
	                        <ui:repeat var="task" value="#{utenteLoggato.listAttivitaDaGestire}">
		                        <li>
		                            <p:link href="#{task[1]}" style="font-size:18px;">
		                                <i class="top-submenu-icon fa-fw #{task[0]}"></i>
		                                <span>#{task[2]}</span>
		                            </p:link>
		                        </li>
	                        </ui:repeat>	                        
	                    </ul>
	                </div>
	                <div class="top-bar-icon">
	                    <a href="#">
	                        <i class="fa fa-envelope-o animated swing" aria-hidden="true"></i>
	                        <h:panelGroup id="lblNum2" rendered="#{utenteLoggato.numMessaggiDaLeggere>0}">
	                        	<i class="top-bar-badge animated rubberBand">#{utenteLoggato.numMessaggiDaLeggere}</i>
	                        </h:panelGroup>
	                    </a>
	                    
	                </div>
	            </div>
	            </h:panelGroup>
	        </div>
	    </div>
</ui:composition>
I see into console error of browser but there isn't error. I think that i have to reinit menu top bar....but how can i do ??
Thank you

aragorn
Posts: 3762
Joined: 29 Jun 2013, 12:38

08 Jul 2019, 10:01

Please make the following change in layout.js;

Code: Select all

bindEvents: function() {        
       ...
        // line 107
        $(function() {
            $this.topbarItems = $('#top-bar').find('> .top-menu > .top-bar-icon');
            $this.topbarLinks = $this.topbarItems.find('> a');
            $this.topbarLinks.off('click.topbarLink').on('click.topbarLink', function(e) {
                $this.topbarLinkClick = true;
                var link = $(this),
                item = link.parent(),
                submenu = item.children('ul');
                
                item.siblings('.active').removeClass('active');
                $this.profileImage.parent().removeClass('active');
                
                if(submenu.length) {
                    submenu.addClass('');
                    item.toggleClass('active');
                    link.toggleClass('active-link');
                    e.preventDefault();
                }
            });
            
            $this.profileImage = $('#profile-image');
            $this.profileImageMobile = $('#profile-image-mobile');
            
            $this.profileImage.off('click.profileImage').on('click.profileImage', function(e) {
                $this.topbarLinkClick = true;
                var link = $(this);
                
                $this.topbarItems.filter('.active').removeClass('active').children().removeClass('active-link');
                
                link.parent().toggleClass('active');
                e.preventDefault();
            });
            
            $this.profileImageMobile.off('click.profileImageMobile').on('click.profileImageMobile', function(e) {
                $this.topbarLinkClick = true;
                var link = $(this);
                
                $this.topbarItems.filter('.active').removeClass('active').children().removeClass('active-link');
                
                link.parent().toggleClass('active');
                e.preventDefault();
            });
        });
    },
    ...

fattanasio
Posts: 8
Joined: 23 Apr 2019, 10:16

08 Jul 2019, 10:46

Hi,
thank you for answer.
I made change but it doesn't work.
The badge number on top bar is updated correctly but when i click on the bell it'isnt open top menu.
If I change or reload the page , top menu it opens correctly

fattanasio
Posts: 8
Joined: 23 Apr 2019, 10:16

08 Jul 2019, 12:05

it works! I place panel group inner ul component e it works.

Thank you

aragorn
Posts: 3762
Joined: 29 Jun 2013, 12:38

08 Jul 2019, 13:15

Glad to hear, thanks a lot for the upıdate!

Best Regards,

Post Reply

Return to “Icarus”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 5 guests