odata kendo grid
by merganser
HTML
<script src="https://kendo.cdn.telerik.com/2015.2.624/js/jquery.min.js"></script>
<script src="https://kendo.cdn.telerik.com/2015.2.624/js/kendo.all.min.js"></script>
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2015.2.624/styles/kendo.common.min.css">
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2015.2.624/styles/kendo.default.min.css">
<h1>
Odata Url Builder
</h1>
<span id="log"></span>
<div id="products"></div>
CSS
/*horizontal Grid scrollbar should appear if the browser window
is shrinked too much
#products table
{
min-width: 1190px;
}*/
JavaScript
Array.prototype.contains = function(obj) {
var i = this.length;
while (i--)
if (this[i] == obj)
return true;
return false;
}
//https://demos.telerik.com/kendo-ui/service/Northwind.svc/Customers
var url = "https://demos.telerik.com/kendo-ui/service/Northwind.svc/Customers";
var selectedColumns=[];
function printurl(s_url)
{
/*var grid = $("#products").data("kendoGrid");
console.log(grid.columns);
var select="";
for(var i = 0; i<grid.columns.length; i++)
{
var column = grid.columns[i];
if(column.hidden!==true)
{
if(column!=null)
{
if(select==""){select=column.field}
else{select=select+","+column.field}
}
}
if(select!="")
{
select="&$select="+select;
}
}
+select
*/
url = s_url;
$("#log").html(url);
}
$(document).ready(function(){
$("#products").kendoGrid({
toolbar: ["excel"],
excel: {
fileName: "Products.xlsx"
/*,
proxyURL: "//demos.telerik.com/kendo-ui/service/export",
filterable: true*/
},
dataSource: {
type: "odata-v4",
transport: {
read: {
url: "https://demos.telerik.com/kendo-ui/service/Northwind.svc/Customers",
beforeSend: function(e, request) {
printurl(request.url);
}
}
},
sort: {
field: "Name",
dir: "desc"
},
schema: {
model: {
id: "ID",
fields: {
ID: { type: "number",...