Overlay menu/panel on datatable row

Components, Ajax Framework, Utilities and More.
Post Reply
vineet
Posts: 387
Joined: 14 Oct 2011, 23:40

01 May 2012, 23:52

Hi ,

Is it possible to get the overlay menu/panel on the datatable row which gets triggered on row selection or single selection ? I am right now using context menu which opens on right click but i have a requirement where the menu should come up on simple left click .


Thanks

Using PF3.3 snapshot , Mojarra 2.13 , WAS 7 ,jre1.6

Josh68
Posts: 33
Joined: 17 Jan 2012, 23:10

12 Jul 2012, 02:17

I would also like to know more about this. I have successfully gotten it to sort of work by assigning the overlayPanel, outside of the dataTable, to a commandLink that's also outside of the dataTable, then using jQuery trigger from commandLinks within my table rows to simulate mousedown on that outside commandLink, which itself is assigned to the overlayPanel. Problem is, even using the jQuery Event object to set positioning, the overlayPanel just positions itself in the upper lefthand corner of the viewport.

Anyone else ever successfully gotten this to work (or regular p:menus, as an option)? Thanks.

User avatar
Oleg
Expert Member
Posts: 3803
Joined: 02 Oct 2009, 09:41
Location: Germany, Black Forest

12 Jul 2012, 09:39

Context menu means menu on right click. This is the nature of context menu. But in general, yes, I said this already many times - any trigger event would be nice. Have you tried this with datatable?

Code: Select all

<p:menu overlay="true" trigger="..." my="left top" at="left bottom"> 
    ...
</p:menu>

or

<p:tieredMenu overlay="true" trigger="..." my="left top" at="left bottom">
    ...
</p:tieredMenu>
By the way, p:menu and p:tieredMenu are almost the same, only behavior of submenus is different.
PrimeFaces Cookbook (2. edition): http://ova2.github.io/primefaces-cookbook/ Learning Angular UI Development with PrimeNG: https://github.com/ova2/angular-develop ... th-primeng Blog: https://medium.com/@OlegVaraksin

Josh68
Posts: 33
Joined: 17 Jan 2012, 23:10

13 Jul 2012, 00:22

My thought with contextMenu was just to trigger right-click using hover on a commandComponent, which correctly controls rowSelect (right-click would still also work, but this would be a second way to activate - no one expects to use context menus on the web, afaik). However, all my attempts at triggering the event are failing to call up the context menu. For regular menus or overlays that expect to have a relation to a trigger target (for at and my positioning), the problem is trying to make an association with a component that lives inside a table row, and therefore has a dynamically generated id containing a rowIndexVar. Doesn't seem to work to use an Id containing a rowIndexVar, for example, in a "for" attribute value. That will work on a widgetVar, but these things are designed to be bound declaratively, using the trigger's component ID.

I even tried triggering menus/overlays using an intermediary trigger/link/target outside the table and passing in coords. Like I said, that "works" (sorta), but the positioning fails and so does (so far) my attempts to trigger the secondary target with other row component events, like mouseenter/hover.

Josh68
Posts: 33
Joined: 17 Jan 2012, 23:10

13 Jul 2012, 18:47

Thought a short code example might help:

Code: Select all

<p:dataTable rowIndexVar="rowIndexVar">
<p:column>
<p:commandLink id="myTrigger">
<f:param name="rowIndexVar" value="#{rowIndexVar}" />
</p:commandLink>
</p:column>
</p:dataTable>
<p:menu trigger="myDatatable:#{rowIndexVar}:myTrigger" />
or similar (trigger value with or without a leading colon), doesn't work (errors out), even if I pass the variable rowIndexVar on rowSelect. I think this didn't cause page error:

Code: Select all

<p:menu for="myDatatable:myTrigger" />
but it also didn't do anything on command-component-based rowSelect.

The actual Id of the command component resolves to

Code: Select all

id="myForm:myDatatable:{n}:myTrigger"
where {n} is the rowIndexVar. Trying to reference that complete component path also doesn't work, with or without a leading colon.

Hope this isn't more confusing than helpful to anyone with a possible answer.

Post Reply
  • Information
  • Who is online

    Users browsing this forum: Google [Bot], Yahoo [Bot] and 16 guests