4 Replies Latest reply on Oct 3, 2015 9:35 AM by vpenugo

    RF 4.5.6 rich:contextMenu is not working

    vpenugo

      Hi,

       

      I am doing simple program to show the context menu. but when I click on the link nothing happens. it is not showing any menu. below is my code. I have tried different modes also. I have tested in IE8 and Firefox 32.0.3.

       

      Approach-1

      <rich:contextMenu attached="false" id="contextMenu" mode="ajax" showDelay="500">

             <rich:menuItem label="Zoom In" id="zin" mode="ajax"/>

             <rich:menuItem label="Zoom Out" id="zout" mode="ajax"/>

      </rich:contextMenu>

      <h:panelGroup id="idCellGroup">

             <h:outputLink id="idLink" value="#" styleClass="idLink">Richfaces ContextMenu

                  <rich:componentControl event="click" target="contextMenu" operation="show"></rich:componentControl>

             </h:outputLink>

      </h:panelGroup>

       

      Approach-2

      <rich:contextMenu target="idLink1" mode="ajax">

        <rich:menuItem label="Zoom In" id="zin1" mode="ajax"/>

        <rich:menuItem label="Zoom Out" id="zout1" mode="ajax"/>

      </rich:contextMenu>

      <h:outputText id="idLink1" value="Richfaces ContextMenu output"/>

       

      both of these are not working.. Is there any problem in my code...?

       

      I am using RF-4.5.6.Final.

        • 1. Re: RF 4.5.6 rich:contextMenu is not working
          michpetrov

          The first one should at least show the menu (and hide it immediately), the second one is ok. Any errors in the console?

           

          The first one should have:

          <rich:componentControl event="click" target="contextMenu" operation="show">
              <a4j:param noEscape="true" value="event" />
          </rich:componentControl>
          

          Upgrade to a newer version, there was a bug in contextmenu that we fixed recently.

          • 2. Re: RF 4.5.6 rich:contextMenu is not working
            vpenugo

            Thank you for your response. There is no errors in console. When i click on the any link in two approaches,  nothing is happening. I will try your suggestion and let you know. Finally in which version the issue was fixed.

            • 3. Re: RF 4.5.6 rich:contextMenu is not working
              michpetrov

              In that case check the generated HTML and try to debug the JavaScript (show method in contextmenu.js). Just upgrade to the latest version - 4.5.9.

              • 4. Re: RF 4.5.6 rich:contextMenu is not working
                vpenugo

                I have tried your suggestion passing param to the componentControl, but this is also not working. below is my contextmenu.js. Unfortunately RF-4.5.9 version is currently not available in my company artifact repository. So, I am not able to use that version. Is there any other lower version that doesn't have any issue with context menus. I am fine to downgrade from RF-4.5.6.Really I am ending up with the ideas. I have other issues as well with Extended DataTables and auto complete components too.

                Just to know that, Is these issues are any way related to my JSF version. currently I am using jsf-api-2.2.6, jsf-impl-2.2.6 jars. Please suggest me If I am using wrong versions.


                (function($, rf) {

                    rf.ui = rf.ui || {};

                 

                    var defaultOptions = {

                        showEvent : 'contextmenu',

                        cssRoot : "ctx",

                        cssClasses : {},

                        attached : true

                    };

                 

                    // constructor definition

                    rf.ui.ContextMenu = function(componentId, options) {

                        this.options = {};

                        $.extend(this.options, defaultOptions, options || {});

                        $super.constructor.call(this, componentId, this.options);

                        this.id = componentId;

                        this.namespace = this.namespace || "." + rf.Event.createNamespace(this.name, this.id);

                        rf.Event.bind('body', 'click' + this.namespace, $.proxy(this.__leaveHandler, this));

                        rf.Event.bindById(this.id, 'click' + this.namespace, $.proxy(this.__clilckHandler, this));

                    }

                 

                    rf.ui.Menu.extend(rf.ui.ContextMenu);

                 

                    // define super class link

                    var $super = rf.ui.ContextMenu.$super;

                 

                    $.extend(rf.ui.ContextMenu.prototype, (function() {

                        return {

                            name : "ContextMenu",

                 

                 

                            getTarget : function() {

                                if (!this.options.attached) {

                                    return null;

                                }

                                var target = typeof this.options.target === 'undefined' ?

                                    this.element.parentNode.id : this.options.target;

                                return target;

                            },

                 

                           __showHandler : function(e) {

                                if (this.__isShown()) {

                                    this.hide();

                                }

                                return $super.__showHandler.call(this, e);

                            },

                 

                            show : function(e) {

                                if (this.menuManager.openedMenu != this.id) {

                                    this.menuManager.shutdownMenu();

                                    this.menuManager.addMenuId(this.id);

                                    this.__showPopup(e); // include the event to position the popup at the cursor

                                    var parent = rf.component(this.target);

                                    if (parent && parent.contextMenuShow) {

                                        parent.contextMenuShow(this, e);

                                    }

                                }

                            },

                 

                            __clilckHandler : function (event) {

                                event.preventDefault();

                                event.stopPropagation();

                            },

                 

                            destroy : function() {

                                rf.Event.unbind('body', 'click' + this.namespace);

                                rf.Event.unbindById(this.id, 'click' + this.namespace);

                 

                 

                                // call parent's destroy method

                                $super.destroy.call(this);

                            }

                        };

                    })());

                })(RichFaces.jQuery, RichFaces);