jQuery to close tooltip in JSF

Question

I am trying to close tooltip using jQuery hide.

On the tooltip, I put a image with onclick event that calls javascript function to hide the tooltip

<img id=... src=... onclick="hideTooltip('formId:tableId:rowIndex:tooltipId')" />

Here is the javascript function

function hideTooltip(elem) {
  var pound = '#';
  jQuery(pound.concat(elem.replace(/:/g, '\\\\:'))).hide('slow');
}

The js function is called as if I put a alert, it will pop up but hide() doesn't work. When I inspect the elements the id of the tooltip is form:table:rowIndex#:tooltipId.

I tried to use widgetVar and it will hide the tooltip but the tooltip shows data based on just the last row and not of each row.

<img ... onclick="PF('widgetVarID').hide()" />

_" doesn't work"_ means? and are you sure the id of the tooltip is `form:table:rowIndex#:tooltipId`? That is **not** the id you try to hide (the # is not after the rowIndex) — Kukeltje, Nov 03 '15 at 18:50
@Kukeltje By doesn't work, I mean it won't hide. I inspected element and id of the tooltip is the same as the one being passed to the `hideTooltip` (I verified by using `alert`) — user4812502, Nov 03 '15 at 18:52
@Kukeltje My bad. That was an typo. By rowIndex#, I meant for example `form:table:0:tooltipId, form:table:1:tooltipId` — user4812502, Nov 03 '15 at 22:19

score 1 · Accepted Answer · edited May 23 '17 at 11:45

1

Your regex is incorrect. The correct format should be '\:'

Replace with pound.concat(elem.replace(/:/g, '\\:'));

You can also use PrimeFaces.escapeClientId().

Check How to use JSF generated HTML element ID with colon ":" in CSS selectors?

edited May 23 '17 at 11:45

Community

1
1

answered Nov 03 '15 at 19:35

sam

2,033
2
10
13

jQuery to close tooltip in JSF

1 Answers1