Opening an image on click with new tab-CodePudding

In my application, I have created a small preview of attachment uploaded earlier. So here to open it, need to right click of the preview and need to select open in new tab.

Other than selecting, how can I change this when user click the image open it on the new tab?

<td>
<img alt="" width="100"  height="100" class="ml-1" src="@Url.Action("RetrieveImage", new { id = item.Id } )"
</td>

I have tried this, but then It's shows error in the Item pass to get the image

<img alt="" width="100"  height="100" class="ml-1" src="@Url.Action("RetrieveImage", new { id = item.Id } , new { @target="_blank"})"

CodePudding user response：

add image as nested tag to a and give it target=_blank value as below

<a href="@Url.Action("RetrieveImage", new { id = item.Id })" target="_blank">
    <img width="220" height="250" border="0" align="center"  src="@Url.Action("RetrieveImage", new { id = item.Id })"/>
</a>

CodePudding user response：

The above Answer is correct but, I would recommend adding rel="noreferrer noopener". As there are security concerns with just using target="_blank". Setting noopener noreferrer prevents phishing attacks. Check out this article : here


<a href="your-url" target="_blank" rel="noreferrer noopener">

        <img alt="" width="100"  height="100" class="ml-1">
</a>