Kendo UI Grid MVC not responding to sync() and refresh()

3 posts, 0 answers
  1. Gordon
    Gordon avatar
    5 posts
    Member since:
    May 2013

    Posted 02 Oct 2013 Link to this post

    I have a grid that I am using to manage outlook contacts. This data grid is using inline editing to make edits to the contacts. I also have a button on the page that reads the contacts from the database and checks for address errors. The issue is that the update does not propagate to the database until I force a browser refresh. The goal is to make changes then check the contact addresses without having to leave the page or force a browser refresh.

    01.   
    02.<div class="SectionBoxCorners" style="width: 1610px;height:760px;position: absolute;top: 180px;left:35px">
    03.    <div class="SectionBoxGradient" style="width: 1610px;height:725px; padding: 10px;padding-right: 20px">
    04.        @(Html.Kendo().Grid<OutlookContact>()   
    05.              .Name("outlookContacts")   
    06.              .Columns(columns =>
    07.                  {
    08.                      columns.Command(command => { command.Edit(); command.Destroy(); }).Width(160);
    09.                      columns.Bound(p => p.FirstName).Width(100);
    10.                      columns.Bound(p => p.LastName).Width(125);
    11.                      columns.Bound(p => p.Suffix).Width(75);
    12.                      columns.Bound(p => p.Company).Width(150);
    13.                      columns.Bound(p => p.Department).Width(100);
    14.                      columns.Bound(p => p.JobTitle).Width(100);
    15.                      columns.Bound(p => p.BusinessStreet).Title("Bus. Street").Width(150);
    16.                      columns.Bound(p => p.BusinessStreet2).Title("Bus. Street 2").Width(150);
    17.                      columns.Bound(p => p.BusinessCity).Width(125);
    18.                      columns.Bound(p => p.BusinessState).Title("Bus. State").Width(100);
    19.                      columns.Bound(p => p.BusinessPostalCode).Title("Bus. Zip").Width(75);
    20.                      columns.Bound(p => p.HomeStreet).Width(150);
    21.                      columns.Bound(p => p.HomeStreet2).Width(150);
    22.                      columns.Bound(p => p.HomeCity).Width(100);
    23.                      columns.Bound(p => p.HomeState).Title("Home State").Width(100);
    24.                      columns.Bound(p => p.HomePostalCode).Title("Home Zip").Width(100);
    25.                      columns.Bound(p => p.AssistantsPhone).Width(150);
    26.                      columns.Bound(p => p.BusinessFax).Title("Bus. Fax").Width(125);
    27.                      columns.Bound(p => p.BusinessPhone).Title("Bus. Phone").Width(125);
    28.                      columns.Bound(p => p.BusinessPhone2).Title("Bus. Phone 2").Width(125);
    29.                      columns.Bound(p => p.HomePhone).Width(125);
    30.                      columns.Bound(p => p.HomePhone2).Width(125);
    31.                      columns.Bound(p => p.MobilePhone).Width(125);
    32.                      columns.Bound(p => p.OtherFax).Width(125);
    33.                      columns.Bound(p => p.OtherPhone).Width(125);
    34.                      columns.Bound(p => p.PrimaryPhone).Width(125);
    35.                      columns.Bound(p => p.Telex).Width(100);
    36.                      columns.Bound(p => p.Account).Width(100);
    37.                      columns.Bound(p => p.Anniversary).Format("{0:MM/dd/yyyy}").Width(100);
    38.                      columns.Bound(p => p.AssistantsName).Width(125);
    39.                      columns.Bound(p => p.BillingInformation).Width(200);
    40.                      columns.Bound(p => p.Birthday).Format("{0:MM/dd/yyyy}").Width(100);
    41.                      columns.Bound(p => p.Categories).Width(200);
    42.                      columns.Bound(p => p.EmailAddress).Width(200);
    43.                      columns.Bound(p => p.EmailDisplayName).Width(250);
    44.                      columns.Bound(p => p.Email2Address).Width(200);
    45.                      columns.Bound(p => p.Email2DisplayName).Width(250);
    46.                      columns.Bound(p => p.Email3Address).Width(200);
    47.                      columns.Bound(p => p.Email3DisplayName).Width(250);
    48.                      columns.Bound(p => p.Gender).Width(100);
    49.                      columns.Bound(p => p.Initials).Title("Init.").Width(50);
    50.                      columns.Bound(p => p.ManagersName).Title("Manager").Width(100);
    51.                      columns.Bound(p => p.Mileage);
    52.                      columns.Bound(p => p.Notes).Width(250);
    53.                      columns.Bound(p => p.OfficeLocation);
    54.                      columns.Bound(p => p.OrganizationalIdNumber).Title("Org. ID").Width(75);
    55.                      columns.Bound(p => p.Spouse).Width(100);
    56.                      columns.Bound(p => p.User1);
    57.                      columns.Bound(p => p.WebPage).Width(200);
    58.                  })
    59.              .ToolBar(toolbar => toolbar.Create())
    60.              .Editable(editable => editable.Mode(GridEditMode.InLine))
    61.              .Filterable()
    62.              .Pageable()
    63.              .Sortable()
    64.              .Scrollable()
    65.              .HtmlAttributes(new { style = "height:675px; td height:50px;" })
    66.              .Resizable(resize => resize.Columns(true))
    67.              .DataSource(dataSource => dataSource
    68.                                            .Ajax()
    69.                                            .AutoSync(true)
    70.                                            .PageSize(100)
    71.                                            .Model(model=> model.Id(p=> p.OutlookContactId))
    72.                                            .Create(update=> update.Action("AddOutlookContact", "Options"))
    73.                                            .Update(update=> update.Action("UpdateOutlookContact", "Options"))
    74.                                            .Destroy(update=> update.Action("DeleteOutlookContact", "Options"))
    75.                                            .Read(read => read.Action("GetOutLookContacts", "Options"))
    76.              ))
    77.        </div>
    78.</div>
    01.@(Html.Kendo().Window()
    02.    .Name("window")
    03.    .Title("Contact Address Errors")
    04.    .Content("loading  info...")
    05.    .LoadContentFrom("CheckContacts", "Options")
    06.    .Iframe(false)
    07.    .Draggable()
    08.    .Resizable()
    09.    .Height(350)
    10.    .Width(350)
    11.)
    12. 
    13.<script>
    14.    $(document).ready(function () {
    15.        $("#window").data("kendoWindow").close();
    16.        $("#CheckContacts")
    17.            .bind("click", function () {
    18.                var grid = $("#outlookContacts").data("kendoGrid");
    19.                //grid.datasource.saveChanges();
    20.                grid.dataSource.sync();
    21.                grid.dataSource.read();
    22.                $("#window").data("kendoWindow").center();
    23.                $("#window").data("kendoWindow").open();
    24.            });
    25.    });
    26.</script>
  2. Vladimir Iliev
    Admin
    Vladimir Iliev avatar
    2192 posts

    Posted 04 Oct 2013 Link to this post

    Hi Gordon,

     
    From the provided information it's not clear for us what is the exact reason for current behavior - could you please provide runable project where the issue is reproduced? This would help us pinpoint the exact reason for this behavior.

    Kind Regards,
    Vladimir Iliev
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. Gordon
    Gordon avatar
    5 posts
    Member since:
    May 2013

    Posted 04 Oct 2013 Link to this post

    Vladimir,

    I was thinking about the problem and I believe that the issue has to do with the fact that the grid is loaded on the server by the model and there is no call back to the controller to reload the model from the entity framework and database.

    I am planning to try the JQuery and AJAX to load of the grid instead to see if it fixes the issue.

    I will post my results.

    Thank you,

    Gordon Neuls
Back to Top