[Solved] How to Show image from SQL FILESTREAM

[Rudolf]

I'm using SQLServer 2008R2 and save images in a FILESTREAM
I use a Telerik Grid and in DetailView I want to show the image
I only have 

int ImageId
nvarchar(50) ImageMimeType
uniqueidentifier (GUID) FilestreamID
varbinary(MAX) Filestream

to identify the image.
I cannot find any info about viewing images from SQL-Database inserted in FILESTREAM.
How looks the ClientTemplate for this?
Upload and save in the database i realized but to show in DetailView I had no success

.DetailView(details => details
    .ClientTemplate(

        Html.Telerik().TabStrip()
            .Name("TabStrip_<#= FiSpeciesId #>")
            .SelectedIndex(0)
            .Items(tabstrip => tabstrip
                            .Add().Text(SharedRes.StringsRes.TabStripHeaderImages).Content(
                                            Html.Telerik().Grid<Atis.Domain.ViewModels.Tbl81Images.GridViewModel>()
    .Name("Tbl81Images_<#= FiSpeciesId #>")
    .Columns(columns => {
        columns.Command(commands => {
            commands.Edit().ButtonType(GridButtonType.Image);
            commands.Delete().ButtonType(GridButtonType.Image);
        }).Width(80);
        columns.Bound(o => o.ShotDate).Width(80).Title(Tbl81ImagesRes.StringsRes.ShotDate);
!!!! here show the image
                columns.Bound(o => o.ImageMimeType).Width(70).Title(Tbl81ImagesRes.StringsRes.ImageMimeType);
                columns.Bound(o => o.FilestreamId).Width(250).Title(Tbl81ImagesRes.StringsRes.FilestreamID);
        columns.Bound(o => o.Memo).Width(450).Title(SharedRes.StringsRes.Memo).Filterable(false);
        columns.Bound(o => o.ImageId).Width(70).Title(Tbl81ImagesRes.StringsRes.ImageID).Visible(true);
    })
    .ToolBar(commands => commands.Insert()
        .ButtonType(GridButtonType.ImageAndText)
        .ImageHtmlAttributes(new {
            style = "margin-left:0"
    }))
    .DataBinding(dataBinding => dataBinding.Ajax()
        .Select("AjaxTbl81ImagesForFiSpeciesHierarchy", "Tbl69FiSpeciesses", new {
                fiSpeciesId = "<#= FiSpeciesId #>"
            })
        .Insert("AjaxInsertImage", "Tbl69FiSpeciesses", new {
                fiSpeciesId = "<#= FiSpeciesId #>"
            })
        .Update("AjaxUpdateImage", "Tbl69FiSpeciesses", new {
                fiSpeciesId = "<#= FiSpeciesId #>"
            })
        .Delete("AjaxDeleteImage", "Tbl69FiSpeciesses", new {
                fiSpeciesId = "<#= FiSpeciesId #>"
            }))
        .DataKeys(keys => {
            keys.Add(o => o.ImageId).RouteKey("ImageId");
            keys.Add(o => o.FiSpeciesId).RouteKey("FiSpeciesId");
            keys.Add(o => o.PlSpeciesId).RouteKey("PlSpeciesId");
        })
        .ClientEvents(events => events
            .OnError("onError")
            .OnDataBound("onDataBoundImages")
            .OnEdit("onEditImages"))
        .Pageable(pagerAction => pagerAction.PageSize(5))
        .KeyboardNavigation()
        .Editable(editing => editing
            .Mode(GridEditMode.PopUp).TemplateName("Image")
            .FormHtmlAttributes(new {enctype = "multipart/form-data"  }))
            .HtmlAttributes(new {
                style = "width: 20%"
            })
            .Sortable()
            .Filterable()
            .ToHtmlString()
        ))

I hope anybody can help.
best regards Rudolf

[Rudolf]

Hi,
I believe, nobody understand my cry for help.
I need a column for Grid in my View to work with GetFileStream in Controller
down an example doesn't work

columns.Bound(o => o.ImageId)

     .ClientTemplate("<img width='100' height='100' alt='<#= ImageId #>' src='"

            + Url.Action("GetFilestream", "Tbl81Images")            

                 + "<#= ImageId #>' />").Title("Picture");

//Image or Video from Filestream to show
public FileContentResult GetFilestream(int id) {
    var imageVideo = _tbl81ImagesRepository.Tbl81Images.First(x => x.ImageID == id);
    if (imageVideo == null)
        throw new ArgumentNullException(StringsRes.ErrorNullException);
    return File(imageVideo.Filestream, imageVideo.ImageMimeType);
}

In edit View

<img src="@Url.Action("GetFilestream", "Tbl81Images", new {id = item.ImageID })"  alt="@Tbl81ImagesRes.StringsRes.Filestream" height="100" width="100" />

I hope I get an answer

[Rudolf]

I found the solution. very easy, but I needed a long time

In Grid of DetailView I need a Template with ClientTemplate

columns.Template(o => o.ImageId)
    .ClientTemplate("<img width='70'  src='" + @Url.Action("GetFilestream", "Tbl81Images", new {
        id = "<#=ImageId#>" }) + "' />")
    .Width(100)
    .HtmlAttributes(new { style = "text-align: center;" });

In Controler GetFileStream with return of byte[] and MimeType

//Image or Video from Filestream to show
public FileContentResult GetFilestream(int id) {
    var imageVideo = _tbl81ImagesRepository.Tbl81Images.First(x => x.ImageID == id);
    if (imageVideo == null)
        throw new ArgumentNullException(StringsRes.ErrorNullException);
    return File(imageVideo.Filestream, imageVideo.ImageMimeType);
}