convert string to normal html tag

Question

I am missing out something here. I am trying to get the image during execution and display in pophover. This pophover is on table row.

The basic flow is, user will hover on one row so this will show a popover on right holding the product image along with some description.

I was able to track the image but while returning the whole image tag is appending as string. Therefore, the code is parsed as string and displayed as it is.

How can I fix this?

$('body').popover({
    placement:"right",
    trigger:"hover",
    selector:'tr[id=popover]',
    content:function(){
        return '<img src = "' + $(this).children("td").children("img")[0].currentSrc + '" width="200" height="200">'
    }
});

I am thinking if I can convert the return part to normal image tag then that can solve this issue.

Hope this screenshots helps.

You need to set the `html` option to `true` for the content to be treated as HTML, otherwise it’ll be treated as text. — CBroe, Dec 07 '17 at 11:27

score 0 · Answer 1 · answered Dec 07 '17 at 11:29

0

https://getbootstrap.com/docs/3.3/javascript/#popovers-options:

html | boolean | false
Insert HTML into the popover. If false, jQuery's text method will be used to insert content into the DOM. Use text if you're worried about XSS attacks.

answered Dec 07 '17 at 11:29

CBroe

91,630
14
92
150

score -2 · Answer 2 · answered Dec 07 '17 at 11:26

-2

Render it inside of jQuery so for example

var x = $(content);
parentEl.append(x)

answered Dec 07 '17 at 11:26

Richard Abear

166
1
15

convert string to normal html tag

2 Answers2