4

我有一个 kendoui 网格，其中列出了声明。其中一列是贷方，它是贷方表的外键引用。我想要的是能够在网格中显示贷方名称而不是其 id 参考。

我将贷方数据源设置如下

var dsLenders = new kendo.data.DataSource({
    transport: {
        read: {
          url: "../data/lenders/",
          dataType: "jsonp"
      },
      parameterMap: function(options, operation) {
          if (operation === "read") {
              return options;
          }
      }
    }
});

网格看起来像这样

 $("#gridClaims").kendoGrid({
      dataSource: claimData,
      autoSync:true,
      batch: true,
      pageable: {
          refresh: true,
          pageSizes: true
      },
      filterable: true,
      sortable: true,
      selectable: "true",
      editable: {
          mode: "popup",
          confirmation: "Are you sure you want to delete this record?",
          template: $("#claimFormPopup").html()
      },
      navigable: true,  // enables keyboard navigation in the grid
      toolbar: ["create"],  // adds insert buttons
      columns: [
          { field:"id_clm", title:"Ref", width: "80px;" },
          { field:"status_clm", title:"Status", width: "80px;" },
          { field:"idldr_clm", title:"Lender", values: dsLenders },
          { field:"type_clm", title:"Claim Type"},
          { field:"value_clm", title:"Value", width: "80px;", format:"{0:c2}", attributes:{style:"text-align:right;"}},
          { field:"created", title:"Created", width: "80px;", format: "{0:dd/MM/yyyy}"},
          { field:"updated", title:"Updated", width: "80px;", format: "{0:dd/MM/yyyy}"},
          { field:"user", title:"User" , width: "100px;"},
          { command: [
              {text: "Details", className: "claim-details"},
              "destroy"
            ],
            title: " ",
            width: "160px"
          }
      ]
  });

但是它仍然在贷方列中显示ID。我已经尝试创建一个本地数据源并且工作正常，所以我现在使用远程数据源与我有关。

任何帮助都会很棒

谢谢

4

3 回答 3

8

简短的回答是你不能。反正不是直接的。见这里和这里。

您可以（如上面链接帖子中提到的响应）将数据预加载到 var 中，然后可以将其用作列定义的数据。

我使用这样的东西： -

function getLookupData(type, callback) {
    return $.ajax({
        dataType: 'json',
        url: '/lookup/' + type,
        success: function (data) {
            callback(data);
        }
    });
}

然后我像这样使用它：-

var countryLookupData;
getLookupData('country', function (data) { countryLookupData = data; });

我在延迟的 JQuery 中使用它，以确保在绑定到网格之前加载所有查找：-

$.when(
    getLookupData('country', function (data) { countryLookupData = data; }),
    getLookupData('state', function (data) { stateLookupData = data; }),
    getLookupData('company', function (data) { companyLookupData = data; })
)
.then(function () {
    bindGrid();
}).fail(function () {
    alert('Error loading lookup data');
});

然后，您可以使用countryLookupData您的价值观。

您也可以使用自定义网格编辑器，但是您可能会发现您仍然需要将数据加载到 var 中（而不是使用带有 DropDownList 的数据源）并确保在网格之前加载数据，因为您'很可能需要查找一个列模板，以便您新选择的值显示在网格中。

我无法让 ForeignKey 以任何有用的方式工作，因此我最终使用了自定义编辑器，因为您可以更好地控制它们。

还有一个问题：确保在定义列之前已经加载了查找数据。我正在使用在变量中定义的列数组，然后将其附加到网格定义......即使在使用网格之前加载了查找数据，如果它是在列定义之后定义的，它将不起作用。

于 2013-02-24T05:33:22.857 回答
0

虽然这篇文章已经过去了 2 年，但我仍然分享我的解决方案

1) 假设 api url ( http://localhost/api/term ) 将返回：

{
    "odata.metadata":"http://localhost/api/$metadata#term","value":[
        {
            "value":2,"text":"2016-2020"
        },{
            "value":1,"text":"2012-2016"
        }
    ]
}

请注意，属性名称必须是“文本”和“值”

2) 显示外部表中的术语名称（文本）而不是 term_id（值）。查看网格列“term_id”，如果添加“values：data_term”，将创建下拉列表

<script>
    $.when($.getJSON("http://localhost/api/term")).then(function () {
        bind_grid(arguments[0].value);
    });

    function bind_grid(data_term) {
        $("#grid").kendoGrid({
            dataSource: ds_proposer,
            filterable: true,
            sortable: true,
            pageable: true,
            selectable: "row",
            columns: [
                { field: "user_type", title: "User type" },
                { field: "user_name", title: "User name" },
                { field: "term_id", title: "Term", values: data_term }
            ],
            editable: {
                mode: "popup",
            }
        });
    }
</script>
于 2015-08-07T03:23:59.797 回答
0

对于那些现在遇到这个问题的人，支持此功能：

https://demos.telerik.com/aspnet-mvc/grid/foreignkeycolumnbinding

于 2021-05-13T12:33:08.107 回答