Dgrid - 显示数字标签(即 02 = Cat)我想显示 Cat - 而不是数字

Dgrid - Display label for number (i.e. 02 = Cat) I want to display Cat - not the number

在我的 Dgrid 中,我有一列显示事件的代码(以数字格式)。 enter image description here

我想在 dgrid 中显示标签而不是数字。所以如果 1 = 猫。在数据库中它显示为 1 - 但我想在 dgrid 中显示 'Cat'。找不到有关如何执行此操作的任何信息。

帮助或引导方向会有所帮助。谢谢!!

更新:6.16.15

这是代码。我能展示的东西有限。

这些是一些代码。 02 = XXXXX,03 = XXXXX1,依此类推。现在,dgrid 显示数字。这有点像一把钥匙。我需要它来显示数字在 dgrid 中代表的内容,而不是数字。所以02应该显示'Traffic Stop'。还不确定如何做 jsfiddle,目前也没有太多额外时间。我能提供的信息有限,所以我必须重新创建一个虚拟版本。

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>XXXXXXXX Events</title>
    <link rel="stylesheet" href="/static/web_ui/dgrid/css/skins/slate.css">

<h1>XXXXXXXX Events</h1>

<form id="queryForm">
        <label for="XXXXXField">XXXXX Type contains:</label>
        <input id="XXXXXField" name="event_type">
        <button type="submit">Filter</button>
        <button type="reset">Reset</button>
    </form>


    <script src="/static/web_ui/dojo/dojo.js"
        data-dojo-config="async: true"></script>

    <script>
        require([
            'dojo/_base/declare',
            'dojo/dom',
            'dojo/on',
            'dstore/Rest',
            'dstore/Request',
            'dgrid/extensions/ColumnResizer',
            'dgrid/extensions/ColumnReorder',
            'dgrid/CellSelection',
            'dgrid/extensions/DijitRegistry',
        //  'dstore/Memory',
        //  'dstore/Trackable',
        //   'dstore/Cache',
            'dgrid/OnDemandGrid'
        //  'dojo/domReady!'
], function (declare, dom, on, Rest, Request, ColumnResizer, ColumnReorder, CellSelection, DijitRegistry, OnDemandGrid) {
        var store = new Rest({target:'/api/XXXXXXEvents/?format=json',
            sortParam: 'ordering', ascendingPrefix:'', descendingPrefix:'-'
    });


    //  var cacheStore = Cache.create(store, {
    //      cachedStore: new (Memory.createSubclass(Trackable)) ()
    //  });

        var grid = window.grid = new (declare([OnDemandGrid, ColumnResizer, ColumnReorder, CellSelection, DijitRegistry])) ({
        collection: store,
        selectionMode: 'single',
        sort: 'id',
    //    idProperty: 'id',

        columns: [
            {field: 'id', label:'ID', resizeable: false},
            {field: 'XXXXX_type', label:'XXXXX Type', resizeable: false},
            {field: 'XXXXX_at', label:'XXXXX Time', resizeable: false},
            {field:'XXXXX', label:'XXXXX Count', resizeable: false},
            {field:'XXXXX', label:'XXXXX', resizeable: false},
            {field:'XXXXX_info', label:'XXXXX Info', resizeable: false},
            {field:'hidden', label:'Hidden', resizeable: false},
            {field:'XXXXX', label:'XXXXX', resizeable: false},
            {field:'XXXXX', label:'XXXXX', resizeable: false}
        ]

    }, 'grid');

 grid.startup();    

    on(dom.byId('queryForm'), 'submit', function(event) {
                event.preventDefault();
                grid.set('collection', store.filter({
                    // Pass a RegExp to Memory's filter method
                    // Note: this code does not go out of its way to escape
                    // characters that have special meaning in RegExps
                    last: new RegExp("^\d+$")
                }));
            });

            on(dom.byId('queryForm'), 'reset', function() {
                // Reset the query when the form is reset
                grid.set('collection', store);
            });

    });

    </script>

</head>

 <body class="slate">
<div id="grid"></div>
</body>
</html>

您需要使用列格式化函数来呈现数据。

检查这里的 jsfiddle

检查 here

中的示例

我以 this 为例并根据您的需要进行了修改。

require([
    'dgrid/Grid',
    'dojo/domReady!'
], function(Grid) {
    var data = [

        { id: 1, number: 7 },
        { id: 2, number: 8 },
        { id: 3, number: 9 }
    ];

    function testFormatter(item){
                //console.log(item,typeof(item));
                var newItem;
                if ( item == 7 ) 
                    newItem = 'Dog'
                else if ( item == 8 )
                    newItem = 'Cat'
                 else if ( item == 9 )
                    newItem = 'Bird'
         return newItem;

    }

    var columnsFormatter = [
                {
                    label: "Number",
                    field: "number",
                    formatter: testFormatter
                }
            ];

    var grid = new Grid({
        columns: columnsFormatter
    }, "gridcontainer");;
    grid.renderArray(data);
});