Telerik RadGrid 导出包括 ajax 填充的图像列

Question

我正在使用Telerik RadGrid来查看数据。其中一列是 GridTemplateColumn，它包含一个元素，该元素在网格加载时由 ajax 调用提供图像源。

我的问题是当我将此网格导出到 Excel/PDF/Word 时，图像列为空。有没有人遇到过这样的场景？

Answer 1

所以我找到了解决这个问题的方法。

在网格中，对图像使用GridBinaryImageColumn。

<telerik:GridBinaryImageColumn 
UniqueName="ImageColumnBin" 
HeaderText="Image" 
Exportable="true"
AlternateText="Image" 
DefaultImageUrl="/images/Default.jpg"  />

使用此列时，可以从客户端或服务器端插入图像。 因此，当网格呈现在页面上时，我使用从 GridsOnRowCreated客户端方法发起的 ajax 调用。

<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
<script>
OnRowCreated: function getBinaryImage(sender, args) {
var dataItem = args.get_gridDataItem();
var html = dataItem.get_cell("ImageColumnBin").innerHTML;
var jqhtml = $($.parseHTML(html.trim()));
var imgID = jqhtml.attr('id');
var pkey = args.getDataKeyValue('Key');
$.ajax({
type: 'POST',
url: 'ResultWindow.aspx/GetBinaryImage',
data: '{ImageKey: ' + pkey + '}',
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (r) {$('#' + imgID).attr('src', r.d);},
error: function (request, error) {console.log("Error: " + request);}
});
}
</script>
</telerik:RadCodeBlock>

因此，每次在客户端创建行时，此 ajax 调用都会加载此图像。 如果您有 500 条记录，但仅显示显示 10 行，则只需加载 10 张图像。

现在，我们需要在这个网格的导出中这些图像。 在服务器端，在网格的ItemDataBound中，检查网格是否正在导出。 如果这是真的，那么我们可以假设用户已经开始导出。 因此，对于绑定的每个项目，我们可以查找图像并将其分配给二进制图像列。

protected void RadGrid_ItemDataBound(object sender, GridItemEventArgs e)
{
if (e.Item is GridDataItem && !e.Item.IsInEditMode)
{
GridDataItem dataBoundItem = e.Item as GridDataItem;
if (RadGrid.IsExporting 
&& RadGrid.MasterTableView.GetColumnSafe("ImageColumnBin") != null 
&& RadGrid.MasterTableView.GetColumnSafe("ImageColumnBin").Display)
{
(dataBoundItem["ImageColumnBin"].Controls[0] as RadBinaryImage).DataValue = GetBinaryImage(dataBoundItem.GetDataKeyValue("Key").ToString());
}
}
}

这个解决方案最适合我。 现在，我的网格中有延迟加载的图像，当我导出此网格时，我拥有了完整的图像集。