首页 > 解决方案 > jQuery数据表中带有超链接的图像未显示

问题描述

我在我的 aspx 站点中有一个div容器,我在后面填充了一个datatable

int[] Center = { 0, 5, 7 };

        string html = "<table id='Liste' class='display' cellspacing='0' style='width:100%'><thead>";
        //add header row
        html += "<tr>";

        for (int i = 0; i <= dt.Columns.Count - 1; i++)
        {
            if (Center.Contains(i)) html += "<th align='center'>" + dt.Columns[i].ColumnName + "</th>";
            else html += "<th>" + dt.Columns[i].ColumnName + "</th>";
        }

        html += "</tr></thead><tbody>";
        //add rows
        for (int i = 0; i < dt.Rows.Count; i++)
        {
            html += "<tr>";
            for (int y = 0; y <= dt.Columns.Count - 1; y++)
            {
                if (y == 8 || y == 9) { html += "<td align='center'>" + Convert.ToDateTime(dt.Rows[i][y].ToString()).ToShortDateString() + "</td>"; }
                else
                {
                    if (y == 10)
                    {
                        html += "<td align='center'><a href='Details.aspx'><img scr='images/Calendar.png'></a></td>";
                    }
                    else
                    {
                        if (Center.Contains(y)) html += "<td align='center'>" + dt.Rows[i][y].ToString() + "</td>";
                        else html += "<td>" + dt.Rows[i][y].ToString() + "</td>";
                    }
                }
            }
            html += "</tr>";
        }
        //footer
        html += "</tbody><tfoot><tr>";
        foreach (DataColumn dc in dt.Columns) html += @"<th>" + dc.ColumnName + "</th>";
        html += "</tr></tfoot></table>";

        html += @"<script>

                    $(document).ready(function() {

                      $('#Liste').DataTable({

                                fixedHeader: {
                                                header: true,
                                                footer: true
                                            },

                                paging: false,

                                columnDefs: [{ type: 'de_date', targets: 8}, 
                                            { type: 'de_date', targets: 9}
                                             ]
                      });
                    });
                   </script>";

        DIV_Table.InnerHtml = html;

在单元格 10 中,图像是否应显示超链接:

if (y == 10)
{
html += "<td align='center'><a href='Details.aspx'><img scr='images/Calendar.png'></a></td>";
}

图像未显示在表格中。如果我标记表格,图像“容器”将以正确的大小显示,并且通过单击“容器”超链接正在工作。如果我单击“容器”的属性,则所有显示的“不可用”都需要大小(这是正确的)。

在此处输入图像描述

我试图渲染第 10 列,但这不起作用:

{ targets: 10,
  render: function(data){
   return '<img src='images/Calendar.png'>'}
}

感谢帮助。

标签: jquerydatatables

解决方案


是因为你的img标签中的错字吗?

...><img scr='images/Calendar.png'></...

它当然应该像在上一个代码片段中那样读取“src”。return但是由于字符串中的引号,最后一点代码不会有问题吗?


推荐阅读