【问题标题】:jqGrid, couldn't get showlink formatter workingjqGrid,无法让 showlink 格式化程序工作
【发布时间】:2011-09-04 21:16:28
【问题描述】:

您好,我正在尝试通过关注 trirand 的 this document 来使 showlink 格式化程序正常工作。

我想要实现的是一个超链接,我可以点击一个编辑视图来更新/编辑记录。但由于某种原因,我想在其中显示超链接的列是空的。

这是我的代码sn-ps,链接是最后一列:

<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>';
}

【问题讨论】:

    标签: javascript jquery jqgrid


    【解决方案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' 列。 id(在您的情况下为 Guid)将用于分配网格的 &lt;tr&gt; 元素(表格行)的 id。因此,您无需两次保存相同的信息

    【讨论】:

    • 谢谢@Oleg,我根据您的反馈修改了我的代码。关于 'select' 和 'showlink',它对我来说也没有意义,但是因为我对 jQuery 和 Javascript 还很陌生,所以我几乎完全从 jqGrid 示例中复制了它,它位于顶部的链接中我的问题。如果您认为示例有误,请告诉我。
    • @pstar:这是文档中的错误。文档是 wiki 文档,这样每个人(比如我)都可以修改它,这很好。所以我刚刚从the 'showlink' example 中删除了edittype: 'select'。我独立于示例编写的所有其他内容。您是否成功修改了代码?您从所描述的方式中选择了哪一种?
    • 再次感谢您修改 Wiki。因为我现在需要固定文本,所以我正在使用自定义格式化程序,它现在正在工作。但我在您的回答中使用了“函数格式化程序”而不是“格式化程序:函数”。
    • @pstar:查看the demothis onethis one,它们都使用formatter: function 形式的自定义格式化程序。如果您查看示例的源代码,您会发现与您所做的不同。无论如何,我很高兴看到您现在至少有一个工作示例。
    • @pstar:还有一件事。因为您不使用投票,所以我希望您注意以下简单规则:here 您可以阅读 “当您看到问题的新答案时,请通过单击指向答案的左侧。答案通常按投票分数排序,因此投票率最高的答案会浮到顶部。其他用户也会对您的问题的答案进行投票。” 为了不被误解,我建议您关注规则和使用投票。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2012-07-12
    • 1970-01-01
    • 1970-01-01
    • 2011-05-22
    • 2018-06-11
    • 2015-12-21
    • 2020-03-07
    相关资源
    最近更新 更多