Quiero agregar un logo para cada juego en mi mesa, tiene que estar encima del título de la primera columna. Los enlaces al logotipo de demostración están en la columna "L" de la tabla de origen, esta columna también define:
L: 'Logo',Así que necesito usar esta variable Logo y convertirla en una imagen.
La siguiente cadena es responsable de la columna de título y necesito modificarla de alguna manera:
{ field: 'Title', sortable: true, minWidth: 180, cellClass: 'title-column'}Intenté algo como, pero no funciona:
{ field: 'Title', sortable: true, minWidth: 180, cellClass: 'title-column', cellRenderer: function(params) { const LogoLink = params.data.Link; let content = ""; if (LogoLink) { content += document.getElementById('make-image').src=LogoLink; }Además, el filtro de la columna de título no debe romperse (es posible que los nombres de los enlaces de imágenes se perciban como contenido, esto no debería suceder).
Tal vez debería ser algo como esto:
{ field: 'Title', sortable: true, minWidth: 180, cellClass: 'title-column', cellRenderer: function(params) { const LogoLink = params.data.Logo; content = LogoLink + params.data.Title; return content; }},pero no sé cómo envolver LogoLink para convertirlo en una imagen HTML.
Código de trabajo completo: https://plnkr.co/plunk/w9bgMFlTF8JPK4t9
Hmm, parece que esta solución funciona:
{ field: 'Title', sortable: true, minWidth: 100, cellClass: 'title-column', cellRenderer: function(params) { const LogoLink = params.data.Logo; LogoLink.id = 'image'; content = '<img src=' + LogoLink + ' class="logo-image">' + params.data.Title; return content; }},Corríjame, por favor, si hay algún error o mala codificación.