ContextMenu component

Vaadin 6 / 7 / 8 Framework UI
121

Solved the graphical problem : there’s a bug in the them component.
Now I’ve a question : is it possible to open context menu from rigth to left and not from left to right ?
The option button in Firefox and chrome will show the menu right to left and I need to emulate the same behaviour.
Some suggestion ?
Tks

122

Hi all,
I’m trying to implement a context menu in a filtertable
With that code, I create the table and create the context menu and when i right click somewhere in the table, the context menu appears.
[code]
//create a table
FilterTable filterTable = new FilterTable();

//create a context menu
ContextMenu contextMenu = new ContextMenu();

//add Items to the context menu
contextMenu.addItem(“Show PDF”);
contextMenu.addItem(“Save”);
contextMenu.addItem(“Delete”)

//insert the context menu in the table
contextMenu.setAsContextMenuOf(filterTable);
[/code]My problem is that i would like to get the Item id of the table or somthing like that cause i need the number of the file to open save or delete.

I tried that code but i dont know what im doing wrong becuase i cant get that information.

        ContextMenuOpenedListener.TableListener tableOpenListener = new ContextMenuOpenedListener.TableListener() {
            public void onContextMenuOpenFromRow(ContextMenuOpenedOnTableRowEvent event) {
                // read clicked row item and property from event and modify menu
                System.out.println("itemId: " + event.getItemId());
                System.out.println("propertyId: " + event.getPropertyId());
            }

           public void onContextMenuOpenFromHeader(ContextMenuOpenedOnTableHeaderEvent event) {
                // read clicked header property from event and modify menu
                   System.out.println("propertyId: " + event.getPropertyId());
           }

           public void onContextMenuOpenFromFooter(ContextMenuOpenedOnTableFooterEvent event) {
                // read clicked footer property from event and modify menu
                   System.out.println("propertyId: " + event.getPropertyId());
           }
        };

        contextMenu.addContextMenuTableListener(tableOpenListener);
123

Hi,
I migrated project to maven from ant. So i had to upgrade contextMenu to 4.5 from 4.1.3. After upgrade, style issues appeared. I looked at previous project’s resources from browser and saw
style.css
style.css (begins with @import url(…/reindeer/legacy-styles.css));
contextmenu.css
legacy-styles.css

When i look new project’s resource, only
style.css
style.css , files are loaded.

i added manually contextmenu.css and legacy-styles.css to my project and style issues are solved. But another problem appeared. Problem is contextmenu never close. After right click context menu opens perfectly but previous menus don’t close.

What should i do to solve this problem

Thanks…

124

I am using Vaadin 7.3.5 and ContextMenu 4.5,

I attached the ContextMenu to an Image (tried other components too) that is inside an inner window, and the popup doesn’t show.
Already tried in components outside the window, it works fine.

Is this a bug?

125

Cool addon, but submenus are opened in wrong position when the page is scrolled. You should take into account the scrolled pixels when you calculate the top position in the client side of the addon

126

The maven dependency for 4.6 is not right.

127

Just to note that im having same issue as Joao Eduardo Galli, context menu doest show if used in sub-window.
Also css is messed up with vaadin 7.4 and valo theme.

Hope this get’s resovled soon.

128

I found a solution for my problem. I opened the context menu via
ContextMenue.open( x, y )
, whereat x and y are the actual coodinates of the mouse cursor. If I manipulate the coordinates a little bit in that way
ContextMenue.open( x+1, y+1 )
 everything works as it should and the end user does not see the “missplaced” contextmenu.
But why it works I have really no idea.

129

I’m using Vaadin 7.4.7 with ContextMenu 4.5

I’m basically trying to get the selected ContextMenuItem but I always come up with null. Here is my code:

        ContextMenu contextMenu = new ContextMenu();
        contextMenu.setAsContextMenuOf(layout);
        
        contextMenu.addItem("item1");
        contextMenu.addItem("item2");
        
        contextMenu.addItemClickListener(new ContextMenuItemClickListener()
        {
            @Override
            public void contextMenuItemClicked(ContextMenuItemClickEvent event)
            {
                ContextMenu.ContextMenuItem clickedItem = (ContextMenu.ContextMenuItem)event.getSource();
                System.out.println("Clicked Item: " + clickedItem.getData());
            }
        });

I'm basically trying to get the ContextMenuItem so that I can add an icon when it's clicked, as well as know which menu item was clicked.

Any suggestions on how to get the clicked ContextMenuItem would be appreciated.
130

Hi Stephan,

you need to add some data with the setData(Object data) method for each of your contextMenuItems.

So change

contextMenu.addItem("item1"); contextMenu.addItem("item2"); to something like:

        ContextMenuItem item1 = contextMenu.addItem("item1");
         item1.setData("some_item1_data");
        ContextMenuItem item2 = contextMenu.addItem("item2");
         item2.setData("some_item2_data");

As set- and getData expects the Java type object, you can optionally even write your own class for it instead of passing Strings.

Sample:

public class ContextMenuData {
    private String ACTION;
    private String id;
    private Object obj;
    
    public String getACTION() {
        return ACTION;
    }

    public void setACTION(String aCTION) {
        ACTION = aCTION;
    }

    public Object getObj() {
        return obj;
    }

    public void setObj(Object obj) {
        this.obj = obj;
    }

}

and then pass it with:

 ContextMenuItem newentry = contextmenu.addItem("New entry", FontAwesome.TABLE);
                    ContextMenuData cmd_new = new ContextMenuData();
                    cmd_new.setACTION("NEW");
                    newentry.setData(cmd_new);
                    newentry.addStyleName("contextmenu");
131

Any chance you could make this support Grid?

Grid doesn’t support context menu or Actions, unlike Table

https://dev.vaadin.com/ticket/16858
https://dev.vaadin.com/ticket/16855

Thanks.

132

Hi Aydin,

Thank you, that worked perfectly! Great plugin!

133

Thanks Aydin and Peter, It works perfectly

134

Does ContextMenu support checkboxes?

I can’t see anything obvious.

Thanks.

135

Hi,

we have just added ContextMenu to our project and observe strange behavior.

We have a multi-level menu, and all levels behave ok, with the exception that nested menu items drift more and more to the right with every new menu invocation.

If we open the page source in Firefox Inspector, we see something like this:

<div [color=#FF0000]
style="width: 117px;"
[/color] tabindex="0" class="v-context-menu-item-basic-submenu v-context-submenu">
  ...
</div>

‘div’ elements that represent menu items have an explicit style/width attribute, and numeric value of this attribute grows with every invocation…

Our component verions are 7.4.2 for Vaadin and 4.5.0 for ContextMenu.

Menu is being used closely to available examples:

LazyEntityTable<Transaction> transactionTable;
ContextMenu menu = new ContextMenu();
ContextMenuItem submenu = menu.addItem("... submenu label...");
submenu.addItem("... submenu item label...");
menu.setOpenAutomatically(true);
menu.setAsTableContextMenu(transactionTable);
transactionTable.addItemClickListener(new ItemClickEvent.ItemClickListener() {
    @Override
    public void itemClick(ItemClickEvent event) {
        if (event.getButton() == MouseButton.RIGHT) {
            menu.open(event.getClientX(), event.getClientY());
        }
    }
});

What may be wrong? Is there anything else to be mentioned?

Thank you in advance for any comments…

136

Hi,

Why ContextMenu listeners (ContextMenuItemClickListener, ContextMenuClosedListener…) does not implements
Serializable
interface?

Thanks,
Dmitry

137

You should use the official
Vaadin ContextMenu Add-On
 for that purpose. The downside is that it requires Vaadin 7.6+ but it does work with Grid. There’s an example in their demo. The upside is that said add-on is likely to become part of Vaadin core at some point.

138

It’s not showing the menu in Vaadin 7.6.4, contextmenu 4.5. Events are firing correctly.

I’ve tried it on a Tree and a TreeTable, in the latest versions of Chrome, Firefox and IE on Windows.

If noone is going to support this anymore, it should be archived. That way the rest of us don’t lose time.

139

Scott, I appreciate your frustration but I’m guessing that this add-on has done an excellent job for many, many years. However, nowadays, and with Vaadin 7.6+, I would look to the semi-official
Vaadin ContextMenu Add-On
 as an alternative.

140

Ah, thanks, I thought I had seen that in my search, but got confused and tried this one instead.