Kendo网格列以及来自服务器的图像 [英] Kendo grid column with image from a server

问题描述

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

I've got a Kendo grid that displays images correctly on a column if the images are stored in my machine.

@(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文件夹的图像.

So, this correctly displays images that are stored on my local hard drive, in the path c:/pics. But now I need to show images that are stored in a specific server instead of the c:/pics folder in my machine.

我尝试在此处替换此位:

I have tried replacing this bit here:

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地址的图像的来源?

How can I set a source for the image that's an IP address of another machine?

如果我在视图的任何其他部分中都有图片标签，则可以正常运行，如下所示:

If I have an image tag in any other part of the View, it works fine, like this:

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

但是在网格的列的ClientTemplate中，我得到了反斜杠错误，这就是为什么我也尝试使用双反斜杠.

But inside the ClientTemplate for the column in the grid I get errors with the backslashes, that's why I tried the double backslashes too.

推荐答案

您是否尝试过将javascript抽出，这样可能对您有用:

Have you tried to pull the javascript out something like this may work for you:

从此:

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函数可以为您建立图像.

Then have a javascript function build up the image for you.

<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>

这通常是我想与客户端模板一起为Kendo网格做一些更有创意的事情时所要做的.

This is usually what I do if I want to do something a bit more creative with the client templating for Kendo grids.

这篇关于Kendo网格列以及来自服务器的图像的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！