JSONP:
I am using this data source for a Kendo Chart, but a similar setup did not work for a Kendo Grid as well.
I am using a WCF service, cross domain, and it is a restful service for the JSONP implementation.
I see the response JSONP data in fiddler, but nothing gets displayed in the Kendo chart. I use almost the same setup with JSON and it works fine. (See "JSON" section below for my JSON implementation)
JSONP data source:
dataSource = new kendo.data.DataSource({
transport: {
read: {
cache: false,
url: "http://localhost/BusinessAgingReportJsonP/RestServiceImplJsonP.svc/BusinessAgingCount",
dataType: jsonp,
jsonpCallback: "JsonPCallBack"
}
},
schema: {
type: "jsonp",
data: "BusinessAgingCountResult",
model: {
fields: { BusinessAgingCount: "text()" }
}
}
})
URL: http://localhost/BusinessAgingReportJsonP/RestServiceImplJsonP.svc/BusinessAgingCount
Response Data from the service: JsonPCallBack( {"BusinessAgingCountResult":[0,0,0,3,0,1,1,6]} );
////////////////////////////////////////////////////////////////////////////////////////////////////////////
JSON:
The setup for JSON is almost the same as that for JSONP above, except the JSON implementation works and the JSONP implementation does not work. What am I doing wrong?
JSON data source:
dataSource = new kendo.data.DataSource({
transport: {
read: {
cache: false,
url: "RestServiceImpl.svc/BusinessAgingCount",
dataType: json
}
},
schema: {
type: "json",
data: "BusinessAgingCountResult",
model: {
fields: { BusinessAgingCount: "text()" }
}
}
})
URL: RestServiceImpl.svc/BusinessAgingCount
Response Data from the service: {"BusinessAgingCountResult":[0,0,0,3,0,1,1,6]}
I am using this data source for a Kendo Chart, but a similar setup did not work for a Kendo Grid as well.
I am using a WCF service, cross domain, and it is a restful service for the JSONP implementation.
I see the response JSONP data in fiddler, but nothing gets displayed in the Kendo chart. I use almost the same setup with JSON and it works fine. (See "JSON" section below for my JSON implementation)
JSONP data source:
dataSource = new kendo.data.DataSource({
transport: {
read: {
cache: false,
url: "http://localhost/BusinessAgingReportJsonP/RestServiceImplJsonP.svc/BusinessAgingCount",
dataType: jsonp,
jsonpCallback: "JsonPCallBack"
}
},
schema: {
type: "jsonp",
data: "BusinessAgingCountResult",
model: {
fields: { BusinessAgingCount: "text()" }
}
}
})
URL: http://localhost/BusinessAgingReportJsonP/RestServiceImplJsonP.svc/BusinessAgingCount
Response Data from the service: JsonPCallBack( {"BusinessAgingCountResult":[0,0,0,3,0,1,1,6]} );
////////////////////////////////////////////////////////////////////////////////////////////////////////////
JSON:
The setup for JSON is almost the same as that for JSONP above, except the JSON implementation works and the JSONP implementation does not work. What am I doing wrong?
JSON data source:
dataSource = new kendo.data.DataSource({
transport: {
read: {
cache: false,
url: "RestServiceImpl.svc/BusinessAgingCount",
dataType: json
}
},
schema: {
type: "json",
data: "BusinessAgingCountResult",
model: {
fields: { BusinessAgingCount: "text()" }
}
}
})
URL: RestServiceImpl.svc/BusinessAgingCount
Response Data from the service: {"BusinessAgingCountResult":[0,0,0,3,0,1,1,6]}
5 Answers, 1 is accepted
0
Victoria
Top achievements
Rank 1
Rank 1
answered on 05 Oct 2012, 11:53 AM
Hi Phil..
In my case even json is not working.
Have created WCF Restful service. table name is Table1
and Servicename created is Table1CollectionService
Have ID and Name as table1 fields.
i am trying to bind this table info to a kendo grid.
i donno what for even this is not working.
<script>
$(document).ready(function () {
$("#grid").kendoGrid({
dataSource: {
type: "json",
transport: {
read: { url: "http://localhost:52408/Table1CollectionService.svc/", contentType: "application/json; charset=utf-8" }
},
schema: {
model: {
fields: { Id: { type: "number" }, Name: { type: "string" }
}
}
},
error: function (e) {
debugger;
alert('error');
},
change: function (e) {
alert("Change");
},
requestStart: function (e) {
debugger;
alert("Request Start");
},
pageSize: 10,
serverPaging: true,
serverFiltering: true,
serverSorting: true
},
filterable: true,
sortable: true,
pageable: true,
columns: [{
field: "Id"
}, { field: "Name" }
]
});
});
</script>
i have added jsonbehaviour attribute on service class also.
but it is not working .please help me if u can
Thanks and Regards
Victoria
In my case even json is not working.
Have created WCF Restful service. table name is Table1
and Servicename created is Table1CollectionService
Have ID and Name as table1 fields.
i am trying to bind this table info to a kendo grid.
i donno what for even this is not working.
<script>
$(document).ready(function () {
$("#grid").kendoGrid({
dataSource: {
type: "json",
transport: {
read: { url: "http://localhost:52408/Table1CollectionService.svc/", contentType: "application/json; charset=utf-8" }
},
schema: {
model: {
fields: { Id: { type: "number" }, Name: { type: "string" }
}
}
},
error: function (e) {
debugger;
alert('error');
},
change: function (e) {
alert("Change");
},
requestStart: function (e) {
debugger;
alert("Request Start");
},
pageSize: 10,
serverPaging: true,
serverFiltering: true,
serverSorting: true
},
filterable: true,
sortable: true,
pageable: true,
columns: [{
field: "Id"
}, { field: "Name" }
]
});
});
</script>
i have added jsonbehaviour attribute on service class also.
but it is not working .please help me if u can
Thanks and Regards
Victoria
0
Phil
Top achievements
Rank 2
Rank 2
answered on 05 Oct 2012, 12:01 PM
Hi Victoria,
Use fiddler2 to make sure that your response from your service is sending back a json object. It's possible that your service is not sending back a json object and that might be your problem. Also, your request might not be sent to the service, so you can check that in fiddler as well.
Also, make sure your web.config file has all the correct information for your json service. I've seen this cause problems.
Also, make sure the url you are using is correct and that it is getting a response from the web service. Type the url in your browser and make sure you see a response.
Also, look at the kendo demos and see how they are structuring their data. If you go to a kendo sample, you can use one of their urls and concatenate it to the demos.kendoui.com url and this will show you the data structure they are using for their json objects.
One other thing that I did to fix my problem:
In the WCF web service interface file, I changed this line of code
FROM
[WebInvoke(Method = "GET", ResponseFormat = WebMessageFormat.Json, BodyStyle = WebMessageBodyStyle.Wrapped, UriTemplate = "BusinessAgingCount")]
TO
[WebInvoke(Method = "GET", ResponseFormat = WebMessageFormat.Json, UriTemplate = "BusinessAgingCount")]
I took out, "BodyStyle = WebMessageBodyStyle.Wrapped" because the wrapper object was causing my kendo widget not to work properly.
Phil
Use fiddler2 to make sure that your response from your service is sending back a json object. It's possible that your service is not sending back a json object and that might be your problem. Also, your request might not be sent to the service, so you can check that in fiddler as well.
Also, make sure your web.config file has all the correct information for your json service. I've seen this cause problems.
Also, make sure the url you are using is correct and that it is getting a response from the web service. Type the url in your browser and make sure you see a response.
Also, look at the kendo demos and see how they are structuring their data. If you go to a kendo sample, you can use one of their urls and concatenate it to the demos.kendoui.com url and this will show you the data structure they are using for their json objects.
One other thing that I did to fix my problem:
In the WCF web service interface file, I changed this line of code
FROM
[WebInvoke(Method = "GET", ResponseFormat = WebMessageFormat.Json, BodyStyle = WebMessageBodyStyle.Wrapped, UriTemplate = "BusinessAgingCount")]
TO
[WebInvoke(Method = "GET", ResponseFormat = WebMessageFormat.Json, UriTemplate = "BusinessAgingCount")]
I took out, "BodyStyle = WebMessageBodyStyle.Wrapped" because the wrapper object was causing my kendo widget not to work properly.
Phil
0
Victoria
Top achievements
Rank 1
Rank 1
answered on 05 Oct 2012, 01:11 PM
Hi Phil,
Thanks for the reply.
with the help of Fidler we found that the methods ReadAccountInJson and ReadAccountInXml both are returning response in xml data only.
and we have used telerik open access itself to generate the interfaces and services.
and all the attributes are specified correctly.
[WebGet(UriTemplate = "?format=json", ResponseFormat = WebMessageFormat.Json)] for ReadAccountInJson method .
we are using webHttpBinding
is there anything else i need to do or change ?
Thanks again for the immediate reply
Regards,
Victoria
Thanks for the reply.
with the help of Fidler we found that the methods ReadAccountInJson and ReadAccountInXml both are returning response in xml data only.
and we have used telerik open access itself to generate the interfaces and services.
and all the attributes are specified correctly.
[WebGet(UriTemplate = "?format=json", ResponseFormat = WebMessageFormat.Json)] for ReadAccountInJson method .
we are using webHttpBinding
is there anything else i need to do or change ?
Thanks again for the immediate reply
Regards,
Victoria
0
Phil
Top achievements
Rank 2
Rank 2
answered on 05 Oct 2012, 01:19 PM
Hi Victoria,
Is the web service outside the domain of your website? In other words, is your web service in a different domain than your website. If so, you have to use jsonp instead of json. Your web service will still return json format but you must construct your web.config file differently. Here is my web.config file that I use for my jsonp implementation (I have json and jsonp settings in the web.config. They are labeled): (Also, I am using Visual Studio 2010 and targetFramework="4.0")
<?xml version="1.0" encoding="utf-8"?>
<configuration>
<system.web>
<compilation debug="true" targetFramework="4.0" />
<httpHandlers>
<add path="Telerik.Web.UI.WebResource.axd" type="Telerik.Web.UI.WebResource" verb="*" validate="false" />
</httpHandlers>
</system.web>
<system.serviceModel>
<services>
<!-- JSONP BEGIN -->
<service behaviorConfiguration="ServiceBehavior" name="VetBizWebServices.JsonP.RestServiceImplJsonP">
<endpoint address="" behaviorConfiguration="web" binding="webHttpBinding" bindingConfiguration="jsonpBinding" contract="VetBizWebServices.JsonP.IRestServiceImplJsonP" />
</service>
<!-- JSON END -->
<!-- JSON BEGIN -->
<service name="VetBizWebServices.Json.RestServiceImpl" behaviorConfiguration="ServiceBehavior">
<endpoint address="" binding="webHttpBinding" contract="VetBizWebServices.Json.IRestServiceImpl" behaviorConfiguration="web">
</endpoint>
</service>
<!-- JSON END -->
</services>
<bindings>
<webHttpBinding>
<binding name="jsonpBinding" crossDomainScriptAccessEnabled="true" />
</webHttpBinding>
</bindings>
<behaviors>
<serviceBehaviors>
<behavior name="ServiceBehavior">
<!-- To avoid disclosing metadata information, set the value below to false and remove the metadata endpoint above before deployment -->
<serviceMetadata httpGetEnabled="true" />
<!-- To receive exception details in faults for debugging purposes, set the value below to true. Set to false before deployment to avoid disclosing exception information -->
<serviceDebug includeExceptionDetailInFaults="false" />
</behavior>
</serviceBehaviors>
<endpointBehaviors>
<behavior name="web">
<webHttp defaultOutgoingResponseFormat="Json" />
</behavior>
</endpointBehaviors>
</behaviors>
<serviceHostingEnvironment multipleSiteBindingsEnabled="true" />
</system.serviceModel>
<system.webServer>
<modules runAllManagedModulesForAllRequests="true" />
<validation validateIntegratedModeConfiguration="false" />
<handlers>
<add name="Telerik.Web.UI.WebResource" path="Telerik.Web.UI.WebResource.axd" verb="*" type="Telerik.Web.UI.WebResource, Telerik.Web.UI" />
<remove name="ExtensionlessUrlHandler-ISAPI-4.0_32bit" />
<remove name="ExtensionlessUrlHandler-ISAPI-4.0_64bit" />
<remove name="ExtensionlessUrlHandler-Integrated-4.0" />
<add name="ExtensionlessUrlHandler-ISAPI-4.0_32bit" path="*." verb="GET,HEAD,POST,DEBUG,PUT,DELETE,PATCH,OPTIONS" modules="IsapiModule" scriptProcessor="%windir%\Microsoft.NET\Framework\v4.0.30319\aspnet_isapi.dll" preCondition="classicMode,runtimeVersionv4.0,bitness32" responseBufferLimit="0" />
<add name="ExtensionlessUrlHandler-ISAPI-4.0_64bit" path="*." verb="GET,HEAD,POST,DEBUG,PUT,DELETE,PATCH,OPTIONS" modules="IsapiModule" scriptProcessor="%windir%\Microsoft.NET\Framework64\v4.0.30319\aspnet_isapi.dll" preCondition="classicMode,runtimeVersionv4.0,bitness64" responseBufferLimit="0" />
<add name="ExtensionlessUrlHandler-Integrated-4.0" path="*." verb="GET,HEAD,POST,DEBUG,PUT,DELETE,PATCH,OPTIONS" type="System.Web.Handlers.TransferRequestHandler" preCondition="integratedMode,runtimeVersionv4.0" />
</handlers>
</system.webServer>
</configuration>
Phil
Is the web service outside the domain of your website? In other words, is your web service in a different domain than your website. If so, you have to use jsonp instead of json. Your web service will still return json format but you must construct your web.config file differently. Here is my web.config file that I use for my jsonp implementation (I have json and jsonp settings in the web.config. They are labeled): (Also, I am using Visual Studio 2010 and targetFramework="4.0")
<?xml version="1.0" encoding="utf-8"?>
<configuration>
<system.web>
<compilation debug="true" targetFramework="4.0" />
<httpHandlers>
<add path="Telerik.Web.UI.WebResource.axd" type="Telerik.Web.UI.WebResource" verb="*" validate="false" />
</httpHandlers>
</system.web>
<system.serviceModel>
<services>
<!-- JSONP BEGIN -->
<service behaviorConfiguration="ServiceBehavior" name="VetBizWebServices.JsonP.RestServiceImplJsonP">
<endpoint address="" behaviorConfiguration="web" binding="webHttpBinding" bindingConfiguration="jsonpBinding" contract="VetBizWebServices.JsonP.IRestServiceImplJsonP" />
</service>
<!-- JSON END -->
<!-- JSON BEGIN -->
<service name="VetBizWebServices.Json.RestServiceImpl" behaviorConfiguration="ServiceBehavior">
<endpoint address="" binding="webHttpBinding" contract="VetBizWebServices.Json.IRestServiceImpl" behaviorConfiguration="web">
</endpoint>
</service>
<!-- JSON END -->
</services>
<bindings>
<webHttpBinding>
<binding name="jsonpBinding" crossDomainScriptAccessEnabled="true" />
</webHttpBinding>
</bindings>
<behaviors>
<serviceBehaviors>
<behavior name="ServiceBehavior">
<!-- To avoid disclosing metadata information, set the value below to false and remove the metadata endpoint above before deployment -->
<serviceMetadata httpGetEnabled="true" />
<!-- To receive exception details in faults for debugging purposes, set the value below to true. Set to false before deployment to avoid disclosing exception information -->
<serviceDebug includeExceptionDetailInFaults="false" />
</behavior>
</serviceBehaviors>
<endpointBehaviors>
<behavior name="web">
<webHttp defaultOutgoingResponseFormat="Json" />
</behavior>
</endpointBehaviors>
</behaviors>
<serviceHostingEnvironment multipleSiteBindingsEnabled="true" />
</system.serviceModel>
<system.webServer>
<modules runAllManagedModulesForAllRequests="true" />
<validation validateIntegratedModeConfiguration="false" />
<handlers>
<add name="Telerik.Web.UI.WebResource" path="Telerik.Web.UI.WebResource.axd" verb="*" type="Telerik.Web.UI.WebResource, Telerik.Web.UI" />
<remove name="ExtensionlessUrlHandler-ISAPI-4.0_32bit" />
<remove name="ExtensionlessUrlHandler-ISAPI-4.0_64bit" />
<remove name="ExtensionlessUrlHandler-Integrated-4.0" />
<add name="ExtensionlessUrlHandler-ISAPI-4.0_32bit" path="*." verb="GET,HEAD,POST,DEBUG,PUT,DELETE,PATCH,OPTIONS" modules="IsapiModule" scriptProcessor="%windir%\Microsoft.NET\Framework\v4.0.30319\aspnet_isapi.dll" preCondition="classicMode,runtimeVersionv4.0,bitness32" responseBufferLimit="0" />
<add name="ExtensionlessUrlHandler-ISAPI-4.0_64bit" path="*." verb="GET,HEAD,POST,DEBUG,PUT,DELETE,PATCH,OPTIONS" modules="IsapiModule" scriptProcessor="%windir%\Microsoft.NET\Framework64\v4.0.30319\aspnet_isapi.dll" preCondition="classicMode,runtimeVersionv4.0,bitness64" responseBufferLimit="0" />
<add name="ExtensionlessUrlHandler-Integrated-4.0" path="*." verb="GET,HEAD,POST,DEBUG,PUT,DELETE,PATCH,OPTIONS" type="System.Web.Handlers.TransferRequestHandler" preCondition="integratedMode,runtimeVersionv4.0" />
</handlers>
</system.webServer>
</configuration>
Phil
0
Victoria
Top achievements
Rank 1
Rank 1
answered on 10 Oct 2012, 01:51 PM
Hi Phil,
Thanks for the reply.
Now i am facing different issue.
But i am able to get the data binded to kendo grid.
this is wcf service application odata V2
created model and service using telerik open access
but some how i am unable to perform inline editing.
i checked in fiddler that when i click on update i could not see anything that is related to update functionality.
and one more strange this is. whenever i add parameterMap object , i am getting error so i have commented it.
error is jquery17100000 ... is not called .
Please help me to get this done.
I have attached the sample project which has both service and client application
please have a look and help.
i have not attached the db but u can connect to any db which is having Accounts table with Id, Name,Adress and City fields.
Thank you
Victoria
Thanks for the reply.
Now i am facing different issue.
But i am able to get the data binded to kendo grid.
this is wcf service application odata V2
created model and service using telerik open access
but some how i am unable to perform inline editing.
i checked in fiddler that when i click on update i could not see anything that is related to update functionality.
and one more strange this is. whenever i add parameterMap object , i am getting error so i have commented it.
error is jquery17100000 ... is not called .
Please help me to get this done.
I have attached the sample project which has both service and client application
please have a look and help.
i have not attached the db but u can connect to any db which is having Accounts table with Id, Name,Adress and City fields.
Thank you
Victoria