This is a migrated thread and some comments may be shown as answers.

MVC Grid not populating from datasource

1 Answer 170 Views
Data Source
This is a migrated thread and some comments may be shown as answers.
Mark
Top achievements
Rank 1
Mark asked on 10 Oct 2013, 01:22 PM
Hi All,

I'm new to KendoUI so please bear with me. I've a Kendo gird on a view as below:

(I've taken out the extra CRUD lines for clarity as I've not got as far as implementing them yet).
@using Kendo.Mvc.UI
@using MvcApplication2.Models
 
 
@{
    ViewBag.Title = "Index";
}
 
<h2>Index</h2>
 
@(Html.Kendo().Grid<MerchantStore>()
    .Name("grid")
    .Columns(columns =>
    {
        columns.Bound(p => p.MerchantStoreId);
        columns.Bound(p => p.Name);
        columns.Bound(p => p.Address1);
        columns.Bound(p => p.TelephoneNumber);
        columns.Command(command => { command.Edit(); command.Destroy(); });
    })
    .ToolBar(toolbar => toolbar.Create())
    .Editable(editable => editable.Mode(GridEditMode.InLine))
    .Pageable()
    .Sortable()
    .Scrollable()
   // .HtmlAttributes(new { style = "height:1430px;" })
    .DataSource(dataSource => dataSource
        .Ajax()
        .PageSize(20)
        .Events(events => events.Error("error_handler"))
        .Model(model => model.Id(p => p.MerchantStoreId))
        .Read(read => read.Action("Read", "Home"))
        
    )
)
<script type="text/javascript">
    function error_handler(e) {   
        if (e.errors) {
            var message = "Errors:\n";
            $.each(e.errors, function (key, value) {
                if ('errors' in value) {
                    $.each(value.errors, function() {
                        message += this + "\n";
                    });
                }
            });       
            alert(message);
        }
    }
</script>
I'm trying to hook up the controller to return a json result provided by a wcf webservices. As below:

public ActionResult Read([DataSourceRequest]DataSourceRequest request)
       {
           var client = new WebClient();
            
           
           return View("Index", Json(
               client.DownloadString("http://localhost:11462/Service1.svc/rest/ListMerchantStore" +
                                     "?merchantId=10000"), JsonRequestBehavior.AllowGet));
       }
but I just get an empty grid. The json looks like:

{"d":[{"__type":"MerchantStoreData:#WcfServiceLibrary1","Address1":"Add1","Address2":null,"Address3":null,"CountryId":826,"CountyState":"","Deleted":false,"EmailAddress":null,"MerchantId":10000,"MerchantIndustryId":1001,"MerchantStoreId":10213,"MerchantStoreKey":"654321","Name":"TEST","PostZipCode":null,"StatusId":0,"TelephoneNumber":null,"TownCity":"City"},{"__type":"MerchantStoreData:#WcfServiceLibrary1","Address1":"Add1","Address2":"Add2","Address3":"Add3","CountryId":826,"CountyState":"","Deleted":false,"EmailAddress":"a@a.a","MerchantId":10000,"MerchantIndustryId":1001,"MerchantStoreId":10214,"MerchantStoreKey":"654321","Name":"TEST","PostZipCode":"","StatusId":1,"TelephoneNumber":"123456","TownCity":"City"}]}

Please can someone kindly point out where i'm going wrong.

Many Thanks

1 Answer, 1 is accepted

Sort by
0
Alexander Popov
Telerik team
answered on 11 Oct 2013, 01:37 PM
Hello Mark,

I noticed that the data is wrapped in a field named "d", but the Grid's dataSource is looking for a "Data" field by default. Although you can specify where the dataSource should look for its items using the schema.data option in Kendo UI Web, this cannot be changed when using the ASP.NET Extensions. I would recommend you to modify the WebService so it returns data in the following structure:   
{"Data":[{"__type":"MerchantStoreData:#WcfServiceLibrary1","Address1":"Add1","Address2":null,"Address3":null,"CountryId":826,"CountyState":"","Deleted":false,"EmailAddress":null,"MerchantId":10000,"MerchantIndustryId":1001,"MerchantStoreId":10213,"MerchantStoreKey":"654321","Name":"TEST","PostZipCode":null,"StatusId":0,"TelephoneNumber":null,"TownCity":"City"},{"__type":"MerchantStoreData:#WcfServiceLibrary1","Address1":"Add1","Address2":"Add2","Address3":"Add3","CountryId":826,"CountyState":"","Deleted":false,"EmailAddress":"a@a.a","MerchantId":10000,"MerchantIndustryId":1001,"MerchantStoreId":10214,"MerchantStoreKey":"654321","Name":"TEST","PostZipCode":"","StatusId":1,"TelephoneNumber":"123456","TownCity":"City"}]}


Regards,
Alexander Popov
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Tags
Data Source
Asked by
Mark
Top achievements
Rank 1
Answers by
Alexander Popov
Telerik team
Share this question
or