Tengo una tabla de boostrap en la cual en una celda del cada row podria cargar el valor de un array convertido a base 64, digo podria porque aveces la propiedad que mapea ese valor podria venir en null:
<table id="tableOcMateriales" class="table table-condensed table-striped table-bordered table-hover dataTables_length" style="width: 100%; align-content: center">
<thead class="ColorHeaderTable">
<tr>
<th style="width: 20%">
@Html.DisplayNameFor(model => model.MaterialDescripcion)
</th>
<th style="display: none"></th>
</tr>
</thead>
<tbody class="celda">
@foreach (var item in Model)
{
<tr data-toggle="popover">
<td style="width: 20%">
@Html.DisplayFor(modelItem => item.MaterialDescripcion)
</td>
<td style="display: none">
@Html.DisplayFor(modelItem => item.ImagenB64)
</td>
</tr>
}
</tbody>
</table>
Estoy tratando de mostrar la imagen en un popover cuando el usuario haga click en el row del Table, para eso estoy usando este script:
<script type="text/javascript" language="javascript">
$(document).ready(function () {
$('#tableOcMateriales').on('click', 'tbody tr', function (event) {
var img;
if (!$(this).closest('tr').find('td').hasClass('dataTables_empty')) {
$(this).addClass('highlightchecked').siblings().removeClass('highlightchecked');
var imagenBase64 = $(this).closest('tr').find('td:eq(7)').text();
if (imagenBase64 !== "") {
img = '<div id ="image"><img src ="data:image/jpeg;base64,' + imagenBase64 + '\" style="width:370px;"/></div>"';
}
else {
img = '';
}
}
if (img !== "") {
var closebtn = $('<button/>', {
type: "button",
text: 'X',
id: 'close-preview',
style: 'font-size: initial;'
});
closebtn.attr("class", "close pull-right");
$('[data-toggle="popover"]').popover({
trigger: 'focus',
container: '.modal-body',
placement: 'auto',
title: "<strong>Preview</strong>" + $(closebtn)[0].outerHTML,
content: img,
html: true
}).popover('show').not(this).popover('hide');
}
$('body').on('click', '#close-preview', function (e) {
$('[data-toggle=popover]').popover('hide');
});
});
});
Con el script anterior logro mostrar el popover pero me muestra la misma imagen en todos los rows, quiero que si el row no contiene el valor de imagen no me muestre el popover.