title: kendoui: How to display foreign key from remote datasource in grid
body: <p>i have a kendoui grid which list claims. one of the columns is lenders which is a foreign key reference to the lenders table. what i want is to be able to display the lender name in the grid instead of its id reference.</p>
  
  <p>ive setup the lenders datasource as follows</p>
  
  <pre><code>var dsLenders = new kendo.data.DataSource({
      transport: {
          read: {
            url: "../data/lenders/",
            dataType: "jsonp"
        },
        parameterMap: function(options, operation) {
            if (operation === "read") {
                return options;
            }
        }
      }
  });
  </code></pre>
  
  <p>and the grid looks like this</p>
  
  <pre><code> $("#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: "&amp;nbsp;",
              width: "160px"
            }
        ]
    });
  </code></pre>
  
  <p>however its still displaying the id in the lenders column. Ive tried creating a local datasource and that works fine so i now is something to do with me using a remote datasource.</p>
  
  <p>any help would be great</p>
  
  <p>thanks </p>