I'm trying to display data in a Handsontable from an AJAX-enabled WCF Service but it does not show anything.
CarsService.svc:
[DataContract]
public class Car
{
[DataMember]
public string Name { get; set; }
[DataMember]
public string Year { get; set; }
}
[ServiceContract(Namespace = "")]
[AspNetCompatibilityRequirements(RequirementsMode = AspNetCompatibilityRequirementsMode.Allowed)]
public class CarsService
{
[OperationContract]
[WebGet(ResponseFormat = WebMessageFormat.Json)]
public IEnumerable<Car> GetCars()
{
var cars = new List<Car>();
var car1 = new Car()
{
Name = "Kia",
Year = "2008"
};
var car2 = new Car()
{
Name = "Nissan",
Year = "2009"
};
cars.Add(car1);
cars.Add(car2);
return cars;
}
}
WebPage:
<head runat="server">
<title></title>
<script type='text/javascript' src='/Scripts/jquery-1.8.3.js'></script>
<script type='text/javascript' src="/Scripts/Handsontable/jquery.handsontable.js"></script>
<script type='text/javascript' src="/Scripts/Handsontable/bootstrap-typeahead.js"></script>
<script type='text/javascript' src="/Scripts/jquery.contextMenu.js"></script>
<script type='text/javascript' src="/Scripts/jquery.ui.position.js"></script>
<link rel="stylesheet" type="text/css" href="/Styles/jquery.contextMenu.css"/>
<link rel="stylesheet" type="text/css" href="/Styles/Handsontable/jquery.handsontable.css"/>
</head>
<body>
<form id="form1" runat="server">
<script type='text/javascript'>
$(window).load(function () {
$.ajax({
url: "/CarsService.svc/GetCars",
type: "GET",
dataType: "json"
})
.success(function (result) {
$("#exampleGrid").handsontable("loadData", result);
})
.fail(function (r, o) {
alert("Failed : " + r.responseText);
});
});
</script>
<div id="exampleGrid" class="dataTable"></div>
</form>
</body>
The following is working for me:
I use newtonsoft's Json.net: http://json.codeplex.com/
The contract for the service:
the wcf service returns:
and the javascript... ('data' is what is returned by my Ajax call)
I hope this is helpful