Telerik Grid UI MVC - data disappears after load

5 posts, 0 answers
  1. Kirtan
    Kirtan avatar
    3 posts
    Member since:
    Apr 2013

    Posted 05 May Link to this post

    Hello, I am using Kendo Grid on my MVC site. Loading data using AJAX call. But, the data disappears right after loading. Below is a code for Grid control in the view. 

    @(Html.Kendo().Grid<SomeViewModelClass>()
                .Name("criteriaGridDiv")
                .AutoBind(false)
                .DataSource(datasource => datasource
                    .Ajax()
                    .Model(module =>
                        {
                            module.Id("ID");
                            module.Field("ScoreValue", typeof(int));
                            module.Field("ProjectID", typeof(string));
                            module.Field("CallMonitoringFormTypeID", typeof(int));
                            module.Field("FailureOnNotMet", typeof(bool));
                        })
                   .Create(create => create.Action("Create_Criteria", "Permission", new { ModuleId = ViewBag.ModuleId }))
                   .Update(update => update.Action("Edit_Criteria", "Permission", new { ModuleId = ViewBag.ModuleId }))
                )
                .Columns(columns =>
                {
                    columns.Bound("ID").Visible(false);
                    columns.Bound("ProjectID").Visible(false);
                    columns.Bound("CallMonitoringFormTypeID").Visible(false);
                    columns.Bound("CriteriaStatement").Title("Criteria");
                    columns.Bound("ScoreValue").Title("Score Value").HtmlAttributes(new { style = "max-width:100px;" });
                    columns.Bound("FailureOnNotMet").Title("Fail call if Not Met?").ClientTemplate("<input type='checkbox' #= FailureOnNotMet ? checked='checked':'' # class='failureOnNotMetCheck' />");
                    columns.Command(command => command.Edit()).HtmlAttributes(new { style = "max-width:200px;" });
                })
                .ToolBar(toolbar => toolbar.Create().Text("Add New Criteria").HtmlAttributes(new { id = "radGridButton" }))
                .Editable(editable => { editable.Mode(GridEditMode.InLine); })            
                .HtmlAttributes(new { style = "max-width:90%;height:500px;" }))

    Any thought on what I am missing here?

     

    Thanks in advance. 

    Kirtan

  2. Radoslav
    Admin
    Radoslav avatar
    1564 posts

    Posted 09 May Link to this post

    Hello Kirtan,

    From the provided code snippet I saw that you do not have a read method of the data source, there are only create and update method. When the grid needs to fetch a data it do it via read method.
    http://docs.telerik.com/kendo-ui/aspnet-mvc/helpers/grid/binding/ajax-binding

    Additionally in the provided code snippet where is a .AutoBind(false) setting. In this case the grid will not hit the server side read method until datasource read() method is not called manually. More information you can find here:
    http://docs.telerik.com/kendo-ui/api/javascript/ui/grid#configuration-autoBind

    So in your case you need to add an Read method and to set the AutoBind to true (or remove it as a setting because its default value is true).

    I hope this helps.

    Regards,
    Radoslav
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  3. UI for ASP.NET MVC is VS 2017 Ready
  4. Swati
    Swati avatar
    9 posts
    Member since:
    Aug 2010

    Posted 26 Aug in reply to Radoslav Link to this post

    Hi Radoslav

    I am facing the same issue. The grid data is disappearing sometimes and not always... The grid configuration is exactly the same as mentioned in this post i.e. AutoBind (false) and no read method in datasource.

    Why this configuration ? - because I want to bind the grid only when it shows in a pop up window and not when the parent page loads.

    If we configure the read method in design time then it would be called when the grid partial view renders on parent page load.

    I understand that adding a read method to configuration will solve the issue. Is there a sure shot way where we don't bind the grid in configuration and bind it when ever we want via javascript?

  5. Pavlina
    Admin
    Pavlina avatar
    6084 posts

    Posted 29 Aug Link to this post

    Hi,

    To achieve your goal you should set the AutoBind to false, and then to populate the grid with data using the Read method when a certain event happens.

    Regards,
    Pavlina
    Telerik by Progress
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  6. Kirtan
    Kirtan avatar
    3 posts
    Member since:
    Apr 2013

    Posted 30 Aug in reply to Pavlina Link to this post

    Radoslav,

    Thanks for the response.

    Your solution worked for me. I put "Read" method with action call, and added AutoBind(false), so it won't load data when the parent page loads, but loads when the certain event is called.

     

    Thanks again.

Back to Top
UI for ASP.NET MVC is VS 2017 Ready