嗨,我正在尝试通过遵循trirand的this document来使showlink格式化程序正常工作。
我要实现的是一个超链接,我可以单击该超链接以查看编辑 View 以更新/编辑记录。但是由于某些原因,我想在其中显示超链接的列为空。
这是我的代码段,链接是最后一列:
<script type="text/javascript">
$(document).ready(function () {
$("#grid_products").jqGrid({
jsonReader: {
repeatitems: false,
id: 'Guid'
},
url: '/Product/jqgridJSON/',
datatype: 'json',
mtype: 'GET',
colNames: ['ProductCode', 'ProductDescription', 'DefaultSellPrice', 'LastCost', 'Edit'],
colModel: [
{ name: 'ProductCode', index: 'Productcode' },
{ name: 'ProductDescription', index: 'ProductDescription' },
{ name: 'DefaultSellPrice', formatter: 'currency', index: 'DefaultSellPrice' },
{ name: 'LastCost', formatter: 'currency', index: 'LastCost' },
{ name: 'MyLink',
edittype: 'select',
formatter: 'showlink',
formatoptions: { baseLinkUrl: '/Product/Update/', idName: 'Guid' }
},
],
pager: '#pager',
rowNum: 10,
rowList: [20, 50, 100, 200],
sortname: 'ProductCode',
sortorder: 'asc',
viewrecords: true,
width: 'auto',
height: 'auto',
caption: 'Products'
}).navGrid('#pager', { edit: true, add: false, del: false });
});
</script>
@{
ViewBag.Title = "JSONGrid";
}
<h2>JSONGrid</h2>
<table id="grid_products"></table>
<div id="pager"></div>
jqGrid的格式化程序适用于货币,但是由于某些原因,它没有显示超链接。
更新:
通过使用自定义格式化程序使它正常工作。
...
{ name: 'MyLink',
formatter: myLinkFormatter,
},
...
function myLinkFormatter (cellvalue, options, rowObjcet) {
return '<a href = "/Product/Edit/' + options.rowId + '">Edit this product</a>';
}
最佳答案
我想您没有为'MyLink'
列的JSON输入填充任何值。因此,超链接为空。如果您想将带有任何固定文本的链接放置在列中,建议您使用custom formatter。有关示例,请参见the recent answer。
另一种可能的解决方法是使用formatter: 'showlink'
并将jsonmap: function() { return "Edit"; }
包括在“MyLink”列定义中。在这种情况下,您无需为每行数据在JSON数据中添加"MyLink":"Edit"
。重要的是要理解,该技巧仅在使用jsonReader: {repeatitems: false}
的情况下才有效(因此它应适用于您的网格)。
如果您还有其他问题,则应在问题文本中包含所使用的JSON数据。
对您当前代码的一些小注释:
edittype: 'select'
和formatter: 'showlink'
是没有意义的。如果要使用formatter: 'showlink'
,则应将其删除。 height: 'atuo'
应该是height: 'auto'
。 pager: $('#pager')
最好替换为pager: '#pager'
。如果使用pager: $('#pager')
,jqGrid将在内部将其替换为pager: '#pager'
,并且对象$('#pager')
将被丢弃。 jsonReader: { id: 'Guid'}
并且不打算向用户显示向导,则可以从网格中删除'Guid'
列。 id
(在您的情况下为Guid
)将用于分配网格的<tr>
元素(表行)的ID。因此,您无需两次保留相同的信息