jqGrid在数据库的行中显示图像

时间:2011-01-27 08:12:02

标签: c# asp.net jquery asp.net-mvc jqgrid

我试图在jqGrid中显示记录中的图像,但它无法正常工作。

我的jqGrid中的每条记录都有一个id。为了从我的数据库表中获取图像,我写了一个ActionResult,它返回一个File(图像),它存储在数据库表中的id。

因为每个记录都有一个唯一的id我在我的页面中有一个隐藏字段,其中jq应该存储格式化程序格式化的实际记录的实际id。

当我用firebug查看代码时,似乎隐藏字段的方式无效。

也许你有个主意?

这是我的代码:

<input type="hidden" name="cellvalue" value="" />
<script type="text/javascript">
$(function () {
    $("#PartialIndexGrid").jqGrid({
        url: '/@ViewContext.RouteData.Values["Controller"].ToString()/IndexGridData',
        datatype: 'json',
        mtype: 'POST',
        colNames: ['Details', 'Bearbeiten','Bild', 'Titel', 'Bearbeitungsort', 'Status'],
        colModel: [
              { name: 'Details', index: "Details", edittype: 'select', align: "center", width: 45, formatter: 'showlink', formatoptions: { baseLinkUrl: '/Shared/Details/', addParam: ''} },
              { name: 'Bearbeiten', index: "Bearbeiten", edittype: 'select', align: "center", width: 80, formatter: 'showlink', formatoptions: { baseLinkUrl: '/Shared/Edit/', addParam: ''} },
              { name: 'Bild', index: 'Bild', edittype: 'image', formatter: imageFormatter },
              { name: 'Titel', index: 'Titel'},
              { name: 'Bearbeitungsort', index: 'Bearbeitungsort' },
              { name: 'AuftragStatus', index: 'AuftragStatus'}
            ],
        pager: $("#PartialIndexGridpager"),
        rowNum: 10,
        rowList: [5, 10, 20, 30],
        sortname: 'Titel',
        sortorder: "asc",
        viewrecords: true,
        width: 942, 
        caption: ''
    })
});
function imageFormatter(cellvalue, options, rowObject) {
        $("cellvalue").val(cellvalue);
        return '<img src="@Url.Action("AuftragDBImage", "Shared", new { id = Request.Form["cellvalue"]})" />';
}; 

public ActionResult AuftragDBImage(Guid id)
    {
        try
        {
            var auftrag = _db.Auftrag.Where(x => x.Auftrag_GUID == id).Select(x => x).Single();
            return File(auftrag.Bild, "image/jpeg");
        }
        catch (Exception)
        {

            return File(pfaddummybild, "image/jpeg");
        }
    }

此致 浮

1 个答案:

答案 0 :(得分:1)

您是否注册了格式化程序?我认为你需要在加载网格之前这样做。这是一个例子:

<script type='text/javascript'>
  $.fn.fmatter.imageFormatter = function(cellvalue, options, rowObject) {
       return "<img src='/Shared/AuftragDBImage?id=" + cellvalue + "'/>";
  }; 
</script>

请注意,格式化程序中没有Request.Form对象(请记住您在客户端上),因此请使用常规URL。