您好我正试图通过跟随this document从trirand获得showlink formatter。
我想要实现的是一个超链接,我可以点击该链接进行编辑视图以更新/编辑记录。但由于某种原因,该列是空的,我想要显示一个超链接。
以下是我的代码段,链接是最后一栏:
<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>';
}
答案 0 :(得分:1)
我认为您在'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,则可以从网格中删除 'Guid'
列。 id
(在您的情况下为Guid
)将用于分配网格的<tr>
元素(表格行)的ID。所以你不需要两次持有相同的信息