带有来自服务器的图像的剑道网格列

Question

如果图像存储在我的机器中，我有一个剑道网格，可以在列上正确显示图像。

@(Html.Kendo().Grid<ProjectName.Models.SomeModel>()
.Name("grid")
.Columns(columns =>
{
    ...
    columns.Bound(c => c.Image).ClientTemplate("<img src='c:/pics/" + "#=Image#' alt='image' Title='image' height='24'/>").Title("Image");
})

因此，这会正确显示存储在我的本地硬盘驱动器上的图像，路径为 c:/pics。但现在我需要显示存储在特定服务器中的图像，而不是我机器中的 c:/pics 文件夹。

我已尝试在此处替换此位：

src='c:/pics/"

使用这些选项：

src='\\999.99.99.999\ProjectName\Images\'
src='\\\\999.99.99.999\\ProjectName\\Images\\'
src='http://999.99.99.999/ProjectName/Images/'
src='999.99.99.999/ProjectName/Images/'

但它们都不起作用。

*注意 999.99.99.999 是假的，我在里面插入真实 IP。

如何将图像的来源设置为另一台机器的 IP 地址？

编辑：

如果我在视图的任何其他部分有图像标签，它可以正常工作，如下所示：

<img src="\\999.99.99.999\ProjectName\Images\somepic.jpg" alt="whatever" />

但是在网格中的列的ClientTemplate 中，反斜杠出现错误，这也是我尝试使用双反斜杠的原因。

Answer 1

您是否尝试过将 javascript 提取出来，这样可能对您有用：

从这里：

columns.Bound(c => c.Image).ClientTemplate("<img src='c:/pics/" + "#=Image#' alt='image' Title='image' height='24'/>").Title("Image");

到这里：

columns.Bound(c => c.Image).ClientTemplate("#=GetMyImage(data.Image)#").Title("Image");

然后让一个 javascript 函数为您构建图像。

<script>

function GetMyImage(image)
{
 var returnString = 'No Image Found'; 

//just checking to see if we have a name for the image 
if(image !== null && image.length > 0)
{
  returnString = '<img src="{Your server details here}\" + image + '" title="image" height="24" alt="image"/>;

return returnString;  
}
}


</script>

如果我想为剑道网格的客户端模板做一些更有创意的事情，我通常会这样做。