reading ASP.NET MVC json result in kendo Grid - ajax

Question

i am using ASP.NET MVC5 and intended to read json data from controller to view in razor page using kendo grid. I am using trial version for time being so i don't have access to kendo server scripting and helper classes... i have jsonResult in controller and i want ajax to call this function from view--> javascript to read and print data...
model class
[Table("FeeZone")]
public class FeeZone
{
public FeeZone()
{
}
[Key]
public int FeeZoneID { get; set; }
[Required]
public string FeeZoneDescription { get; set; }
[StringLength(50, ErrorMessage = "Description Max Length is 50")]
[Required]
public string CurrencyLabel { get; set; }
[StringLength(10, ErrorMessage = "Description Max Length is 10")]
[Required]
public string CurrencySymbol { get; set; }
[StringLength(50, ErrorMessage = "Description Max Length is 50")]
[Required]
public string CurrencyCode { get; set; }
}
Controller class
public ActionResult FreeZone()
{
var query_result = Q_UOF.GetAllFeeZone();
return View(query_result.ToList());
}
public JsonResult GetAllFreeZone()
{
var allFreeZone = Q_UOF.GetAllFeeZone().ToList();
return Json(allFreeZone, JsonRequestBehavior.AllowGet);
}
razor -- view page
model IEnumerable<DatabaseLayer.TableMappings.FeeZone>
#{
ViewBag.Title = "FreeZone";
Layout = "~/Views/Shared/_Layout_Master.cshtml";
}
<script type="text/javascript">
$(document).ready(function () {
//load ALl freeZone from JSON Method
var RemoteJsonData = new kendo.data.DataSource(
{
transport:
{
read: {
type: "Get",
dataType: "json",
url: "Qualification/GetAllFreeZone"
},
pageSize: 4
}
})
//View all FreeZone data in Kendo Grid
$("#FreeZone_ViewAll_Grid").kendoGrid({
columns: [
{ title: "FeeZoneID" },
{ title: "FeeZoneDescription" },
{ title: "CurrencyLabel" },
{ title: "CurrencySymbol" },
{ title: "CurrencyCode" }
],
dataSource: RemoteJsonData
});
})
</script>
<div id="FreeZone_ViewAll_Grid"></div>

Answer 1

$.ajax({
url: '#Url.Action("GetAllFreeZone", "Qualification")',
type: 'POST',
dataType: "json",
success: function (result) {
var Freezone=result.Freezone;
var dataSource = new kendo.data.DataSource({
data:Freezone
});
$('#FreeZone_ViewAll_Grid').data('kendoGrid').dataSource.data(Freezone);
},
async: false
});
Controller function
[AcceptVerbs(HttpVerbs.Post)]
public JsonResult GetAllFreeZone([DataSourceRequest] DataSourceRequest request)
{
var allFreeZone = Q_UOF.GetAllFeeZone().ToList();
return Json(allFreeZone.ToDataSourceResult(request));
}