jquery - 在jqgrid的列中添加图像

Question

我想在 jqgrid 的第一列中显示一个小图像，以显示我从数据库获取的所有数据。

jquery("#tableName").jqgrid({
.....
colNames : ['', ''],
colModel : [{
    width : '25%',
    },{
    name : 'someValue',
    index : 'somevalue',
    widht : '75%',
    sorttype: 'text'
}]
});

我想在第一个 colmodel 中添加图像。我尝试了格式化程序，但不确定单元格值、行对象、选项。任何帮助，将不胜感激。

我对图像做了类似的事情

function imageFormat( cellvalue, options, rowObject ){
        return '<img src="'+cellvalue+'" />';
    }

我应该在哪里提供图像 src ？如何在 colmodel 中提及 imageformat ？

谢谢

Answer 1

如果您需要在网格的第一列中设置图像，您可以定义网格

$("#tableName").jqGrid({
    .....
    colNames: ['', ''],
    colModel: [
        {
            name: 'someUniqueColumnName',
            width: 25,
            fixed: true,
            formatter: function () {
                return "<img src='http://myserver/path/i.jpg' alt='my image' />";
            }
        },
        {
            name: 'someValue',
            width: 123 // width of column in pixel
        }
    ],
    ...
});

格式化程序只需要返回一个字符串，该字符串是需要放置在列中的 HTML 片段。因为 JavaScript 中的所有参数都是可选的，我们不需要，所以我们可以将 formatter 定义为不带参数的函数。属性 width 是列的大小(以像素为单位)。如果您使用其他 jqGrid 选项，例如 autowidth: true 或指定网格的整个宽度(如果您不这样做)如果使用 shr​​inkToFit: false 选项)，那么 jqGrid 将根据 colModel 中列的 width 属性的值缩放列宽。为了不使用图像缩放列，我另外添加了 fixed: true 属性。

一些常见的评论:您应该注意 JavaScript 中名称的大小写。例如，您发布的第一行代码 (jquery("#tableName").jqgrid({) 应替换为 jQuery("#tableName").jqGrid({.