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

unable to bind grid properly

1 Answer 86 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Imteyaz
Top achievements
Rank 1
Imteyaz asked on 05 Jan 2013, 09:36 AM
Hello I have a grid in my razor view,
I have added these resources
<link rel="stylesheet" href="@Url.Content("~/Content/KendoThemes/kendo.common.min.css")">
    <link rel="stylesheet" href="@Url.Content("~/Content/KendoThemes/kendo.rtl.min.css")">
    <link rel="stylesheet" href="@Url.Content("~/Content/KendoThemes/kendo.default.min.css")">
 
<script src="@Url.Content("~/Scripts/jquery.min.js")"></script>
    <script src="@Url.Content("~/Scripts/kendo.web.min.js")"></script>
    <script src="@Url.Content("~/Scripts/kendo.aspnetmvc.min.js")"></script>


here is my grid

  
@(Html.Kendo().Grid<Nop.Web.Models.Customer.CustomerInfoModel>()
    .Name("Grid")   
    .Columns(columns => {       
        columns.Bound(p => p.Active);
       // columns.Bound(p => p.cbSubscriptions).ClientTemplate("#=Employee.EmployeeName#");
        columns.Bound(p => p.cbSubscriptions);
        columns.Bound(p => p.FirstName);
        columns.Command(command => { command.Edit(); command.Destroy(); }).Width(200);   
    })   
    .ToolBar(toolBar => toolBar.Create())
    .Editable(editable => editable.Mode(GridEditMode.InLine))
    .Pageable()
    .Sortable()
    .Scrollable()
            .DataSource(dataSource => dataSource
                .Ajax()
                .Events(events => events.Error("error_handler"))
                .Model(model => model.Id(p => p.Id))
                        .Create(update => update.Action("EditingInline_Create", "Customer"))
                        .Read(read => read.Action("UsersList", "Customer"))
                .Update(update => update.Action("EditingInline_Update", "Grid"))
                .Destroy(update => update.Action("EditingInline_Destroy", "Grid"))
            )
)
<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>

This works fine. it calls my action in controller to read the data, but the problem is that, it is displaying any rows in grid, even the controller returns the record. I have checked the console, there is no script error, and my network tab shows that these data has been transferred from the server. 

  1. data[{Email:familymanager1_user1@gmail.com, AllowUsersToChangeUsernames:false, UsernamesEnabled:false,…},…]
    1. 0{Email:familymanager1_user1@gmail.com, AllowUsersToChangeUsernames:false, UsernamesEnabled:false,…}
    2. 1{Email:familymanager1_user2@gmail.com, AllowUsersToChangeUsernames:false, UsernamesEnabled:false,…}
    3. 2{Email:familymanager1_user3@gmail.com, AllowUsersToChangeUsernames:false, UsernamesEnabled:false,…}
    4. 3{Email:as@sad.com, AllowUsersToChangeUsernames:false, UsernamesEnabled:false, Username:aasasasasas687,…}
  2. total4

Am I missing something to add. 

1 Answer, 1 is accepted

Sort by
0
Nikolay Rusev
Telerik team
answered on 07 Jan 2013, 07:44 AM
Hello Imteyaz,

data and total fields in the response must be with first capital letter, i.e Data/Total.

If you follow the instructions you should have everything working properly.

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