Rightpanel Menu disappear when click inside Selectonemenu

markusg80
Posts: 54
Joined: 21 Nov 2013, 17:11

31 Aug 2018, 19:23

Ok this skript is only to solve the Calendar bug! It is still needed to add appendto=@this to select* components! I was thinking that this script will also solve the Problem with the select* components because my Solution to add appendto is just a workaround in my oppinion! I ican confirm that the strange behevior of calendar is solved
PrimeFaces 6.2.8,Mojarra 2.3.0,Payara 5.182

markusg80
Posts: 54
Joined: 21 Nov 2013, 17:11

10 Sep 2018, 21:17

@huseyinT: Please can u also solve the Problem with the select* components that it isnot neccessary to add appendto this? Because if the panel is larger than the rightpanel in width the right part of the panel is out of the screen! Without appendto to the position of the panel is perfect!
PrimeFaces 6.2.8,Mojarra 2.3.0,Payara 5.182

huseyinT
Posts: 114
Joined: 27 Mar 2016, 13:05

12 Sep 2018, 13:40

You should use 'appendTo' property components.

The calendar doesn't have "appendTo", we added the script for you.

Greetings,

markusg80
Posts: 54
Joined: 21 Nov 2013, 17:11

12 Sep 2018, 14:04

At the moment i have set appendTo for all select* components. Here example with selectCheckboxMenu:

Code: Select all

                                    <p:selectCheckboxMenu id="unitchooser" 
                                                          value="#{useReportBean.selectedMilunits}"
                                                          converter="omnifaces.SelectItemsConverter"
                                                          label="#{intl.unit}"
                                                          appendTo="@this"
                                                          disabled="#{useReportBean.dateSelection}"
                                                          filter="true" filterMatchMode="contains">
                                        <f:selectItems value="#{useReportBean.milunitsForSelectedSite}" 
                                                       var="milunit" itemLabel="#{milunit.name}" 
                                                       itemValue="#{milunit}" />
                                        <p:ajax listener="#{useReportBean.onMilunitSelect}"
                                                partialSubmit="true" process="@this"
                                                update="rangestart rangestop" />
                                    </p:selectCheckboxMenu>
But with this part the Overlay Panel is out of Screen:
Image

The fix for calendar is working perfect! Now it should be fixed the issue also for select* Components so that the appendTo=this no longer is needed

This is absolutly bad.
PrimeFaces 6.2.8,Mojarra 2.3.0,Payara 5.182

User avatar
aragorn
Posts: 3110
Joined: 29 Jun 2013, 12:38

14 Sep 2018, 13:55

Please try the following JS code instead of appendTo="@this" in right panel;

Code: Select all

<script type="text/javascript">
//<![CDATA[
/** 
 * PrimeFaces Ultima Layout
 * @Override _bindEvents method
 */
PrimeFaces.widget.Ultima = PrimeFaces.widget.Ultima.extend({
    
    _bindEvents: function() {
        this._super();
        
        var $this = this;
        
        $(document.body).off('click').on('click', function(e) {
            if(($this.isHorizontal() || $this.isSlim()) && !$this.menuClick && $this.isDesktop()) {
                $this.menu.find('.active-menuitem').removeClass('active-menuitem');
                $this.menu.find('ul:visible').hide();
                $this.menuActive = false;
            }
            
            if(!$this.topbarMenuClick && !$this.topbarLinkClick) {
                $this.topbarItems.find('.active-top-menu').removeClass('active-top-menu');
            }
            
            if(!$this.menuClick && $this.isSlim()) {
                $this.deactivateItems($this.menu.children('.active-menuitem'), false);
            }
            
            if(!$this.rightPanelClick && !$this.rightPanelButtonClick && $this.rightPanel.hasClass('layout-rightpanel-active') && !$this.isDatePickerPanelClicked() && !$this.isOverlayInputPanelClicked(e)) {                
                $this.rightPanel.removeClass('layout-rightpanel-active');
                $this.rightPanelButton.removeClass('rightpanel-btn-active');
            }
            
            if(!$this.topbarMenuClick && !$this.topbarLinkClick) {
                $this.topbarItems.removeClass('topbar-items-visible');
            }
                        
            $this.menuClick = false;
            $this.menuButtonClick = false;
            $this.topbarLinkClick = false;
            $this.topbarMenuClick = false;
            $this.rightPanelClick = false;
            $this.rightPanelButtonClick = false;
        });
    },
    
    isDatePickerPanelClicked: function() {
        if($.datepicker) {
            var input = $($.datepicker._lastInput);
            if(input.closest('.layout-rightpanel').length && $('#ui-datepicker-div').is(':visible')) {
                return true;
            }
        }
        return false;
    },
    
    isOverlayInputPanelClicked: function(e) {
        var el = $(e.target),
        panel = el.closest('.ui-input-overlay');
        if(panel.length) {
            var inputId = panel.attr('id').replace(/_panel/g, '');
            input = $(PrimeFaces.escapeClientId(inputId));

            if(input.length && input.closest('.layout-rightpanel').length) {
                return true;
            }
        }
        return false;
    }
    
});
//]]>
   </script>

markusg80
Posts: 54
Joined: 21 Nov 2013, 17:11

15 Sep 2018, 21:39

@aragorn: You made it! Now it works like expected! Thx so much. Can u please merge this fix to ultima 1.1.4?
PrimeFaces 6.2.8,Mojarra 2.3.0,Payara 5.182

User avatar
aragorn
Posts: 3110
Joined: 29 Jun 2013, 12:38

17 Sep 2018, 12:06

You're welcome! I'll add it to next version.

Best Regards,

Post Reply

Return to “Ultima - PrimeFaces”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 1 guest