Adding a tooltip dynamically

Question

I am adding an image in a loop by iterating using struts tag. I've an image for which tooltip can vary depending on certain condtion.

I'm adding image in the following way inside a loop -

<logic:iterate> ....
<img src="../images/report_<bean:write name="vo" property="field(repType)" bundle="coreRes"/>.png" width="13" height="13" style="vertical-align: middle; cursor:pointer;" id = "repImg" onmouseover = "generateTooltip('<bean:jsParam name="vo" property="field(repType)" bundle="esmcoreRes"/>')" 

</logic:iterate>

based on the repType value i'll be adding different images. For instance if repType returns "1" i'll add an image as "A", if "2" image will be "B" . Now i need to add a tooltip which will display different values depending on the reportType.

below is the javascript code i tried -

function generateTooltip(repType){

var tooltip = '';

// logic to determine tooltip based on repType is written here

    //$('#repImg').prop('title', tooltip );
    $("#repImg").attr('title', tooltip );
    //$("#repImg").css('cursor','pointer').attr('title', tooltip );
}

I've tried several approach in Javascript method mentioned above. But the tooltip is getting displayed only for the 1st image. For rest of the images tooltip isn't getting displayed.

Can anyone help me on this.

why the java tag?

Shanu Gupta
– Shanu Gupta

2018-06-07 11:09:09 +00:00
Commented Jun 7, 2018 at 11:09 — Shanu Gupta
– Shanu Gupta, Commented Jun 7, 2018 at 11:09

SG52 · Accepted Answer · 2018-06-07 11:13:22Z

1

You have to use .each() function, or just change ID to class. jQuery just select 1 element if your selector is a #ID

try :

$(".repImg").attr('title', tooltip );

and

<logic:iterate> ....
<img class="repImg" src="...

More info: https://learn.jquery.com/using-jquery-core/faq/how-do-i-select-an-item-using-class-or-id/

answered Jun 7, 2018 at 11:13

SG52

3541 silver badge11 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Adding a tooltip dynamically

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related