Kendo UI grid odata

0
votes

My setup is the following

  • IIS 8.5
  • KendoUI
  • Server 2012
  • MSSQL

I am pretty new to odata, just found out about it due to kendo ui where it seems it's the best way to get data from sql.

I successfully created a asp.net web app on C# to be able to get the odata from my server, if i tets this on my browser it works like a charm, i get my information json fromatted.

since im new to this i might have something wrong here, but my RESTful service is on a seperate site than my main site where i will be using the kendo Grid. I have the Restful on port 8080 while my normal site on port 80

this is my code wher my Grid is being generated.

$("#vehiclesGrid").kendoGrid({
                        dataSource: {
                            type: "odata",
                            transport: {
                                read: {
                                    url: "http://mydomain(security issues):8000/odata/GetVehiclesConfigureds",
                                    dataType: "json"
                                },
                                schema:{
                                    model:{
                                        fields:{
                                            displayName:{type: "string"},
                                            sensor:{type: "number"},
                                            alertFlag:{type: "number"}
                                        }
                                    }
                                }
                            }

                        },
                        height: 550,
                        groupable: true,
                        sortable: true,
                        columns: [{
                            field: "displayName",
                            title: "Display Name",
                            width: 100
                        }, {
                            field: "sensor",
                            title: "# of Sensors"
                        }, {
                            field: "alertFlag",
                            title: "Alert Pending"
                        }]
                    });
<div id="vehiclesGrid"></div>

and on the console i get the following error:

XMLHttpRequest cannot load http://mydomain(security issues):8000/odata/GetVehiclesConfigureds?%24inlinecount=allpages. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://mydomain(security issues)' is therefore not allowed access.

if i go to developer tools in the network section i can see the odata information being retrieved correctly, but the grid is empty.So i don't know why it wouldn't display it or even if it has something to do with that error on console.

1
asp.netiiskendo-uikendo-gridodata

1 Answers

2
votes

Looking at the error, it looks like you have a CORS issue. So enable CORS on your ODATA app.

Via Code WebApiConfig.cs

config.EnableCors();

YourController.cs

[EnableCors(origins: "http://Yourdomain.website.com", headers: "*", methods: "*")]
public class YourController: ODataController
{
  //details
}