Persist-State Issues

2 posts, 0 answers
  1. Diego
    Diego avatar
    3 posts
    Member since:
    Aug 2016

    Posted 20 Sep Link to this post

    Hello, i have a problem with my Grid and Persist-State, when i use "Load" state, the grid lose all properties(Edit and Remove bottons, Tooltips and styles).

    This is the Code.

    @{
                          string quote = "\"";
                          var javaScriptSerializer = new System.Web.Script.Serialization.JavaScriptSerializer();
                          string jsonString = javaScriptSerializer.Serialize(DictionaryByControls.TagsConfirmationPanel);
     
                      }
                      @(Html.Kendo().Grid<ControlGAS.DataAccess.Entities.Customer>()
                          .Name("GridCustomers")
                          .Columns(columns =>
                          {
                              columns.Bound(customer => customer.Id).Title("ID").Filterable(f => f.UI("filterById")).HtmlAttributes(new { @style = "white-space: nowrap;" });
                              columns.Bound(customer => customer.Denomination).Title(ControlGAS.Office.Resources.Resources.ControlGAS.Denomination).Filterable(f => f.UI("filterByName")).HtmlAttributes(new { @style = "white-space: nowrap;" });
                              columns.Bound(customer => customer.Code).Title(ControlGAS.Office.Resources.Resources.ControlGAS.Code).Filterable(f => f.UI("filterByCode")).HtmlAttributes(new { @style = "white-space: nowrap;" });
                              columns.Bound(customer => customer.Address).Title(ControlGAS.Office.Resources.Resources.ControlGAS.Address).Filterable(f => f.UI("filterByAddress")).HtmlAttributes(new { @style = "white-space: nowrap;" });
                              columns.Bound(customer => customer.City).Title(ControlGAS.Office.Resources.Resources.ControlGAS.City).Filterable(f => f.UI("filterByCity")).HtmlAttributes(new { @style = "white-space: nowrap;" });
                              columns.Bound(customer => customer.FiscalIdentification).Title(ControlGAS.Office.Resources.Resources.ControlGAS.FiscalIdentification).Filterable(f => f.UI("filterByFiscalId")).HtmlAttributes(new { @style = "white-space: nowrap;" });
                              columns.Template(customer => { }).ClientTemplate(
                                  "<a href=" + quote + @Url.Action("Editing", "Customer", new { customerId = "#=Id#" }) + quote + "><i class='font-size-20 icon md-edit margin-right-10' aria-hidden='true'></i></a>" + "" +
                                  "<a class='cursor-pointer' data-customer='#=Denomination#'data-id-customer='#=Id#' data-resource = '" + jsonString + "'  data-control='btn-delete-customer'><i class='font-size-20 icon md-delete margin-right-10' aria-hidden='true'></i></a>")
                                  .Title("Actions").Width(100);
     
                          })
                          .ColumnMenu()
                          .Scrollable(s => s.Height("100%"))
                          .Sortable()
                          .Groupable(g => g.Messages(m => m.Empty(ControlGAS.Office.Resources.Resources.ControlGAS.Drag)))
                          .Pageable(p => p
                                          .Refresh(true)
                                          .PageSizes(true)
                                          .ButtonCount(5)
                                          .PreviousNext(true)
                                          .Messages(m => m.ItemsPerPage(ControlGAS.Office.Resources.Resources.ControlGAS.ItemPerPage)))
     
                          .DataSource(
                              dataSource => dataSource
                              .Ajax()
                              .Read(read => read.Action("GetCustomers", "Customer"))
                          )
                          .Resizable(r => r.Columns(true))
                          .Reorderable(r => r.Columns(true))
                          .ClientDetailTemplateId("master")
                          .Filterable(filter => filter.Mode(GridFilterMode.Row)
                                .Extra(false)
                                .Operators(operators => operators
                                    .ForString(str => str.Clear()
                                        .StartsWith(ControlGAS.Office.Resources.Resources.ControlGAS.StartsWith)
                                        .IsEqualTo(ControlGAS.Office.Resources.Resources.ControlGAS.IsEqualTo)
                                        .IsNotEqualTo(ControlGAS.Office.Resources.Resources.ControlGAS.IsNotEqualTo)
     
                                   )
                                   .ForNumber(num => num.Clear()
                                        .IsEqualTo(ControlGAS.Office.Resources.Resources.ControlGAS.IsEqualTo)
                                        .IsNotEqualTo(ControlGAS.Office.Resources.Resources.ControlGAS.IsNotEqualTo)
                                        .IsNull(ControlGAS.Office.Resources.Resources.ControlGAS.IsNull)
                                        .IsLessThan(ControlGAS.Office.Resources.Resources.ControlGAS.IsLessThan)
                                        .IsGreaterThan(ControlGAS.Office.Resources.Resources.ControlGAS.IsGreaterThan))
     
                              )
                          )
                          .Events(events => events.DataBound("dataBound"))
                      )

    Save State

    function GetDataGrid() {
        var grid = $("#GridCustomers").data("kendoGrid");
        var dataSource = grid.dataSource;
        var currentColumnState = new Array();
     
        for (var i = 0; i < grid.columns.length; i++) {
     
            if (grid.columns[i].hidden == undefined) {
                grid.columns[i].hidden = false;
                currentColumnState.push({
                    field: grid.columns[i].field,
                    hidden: grid.columns[i].hidden
                });
            }
            else {
                currentColumnState.push({
                    field: grid.columns[i].field,
                    hidden: grid.columns[i].hidden
                });
            }
        }
     
        var state = {
            page: dataSource.page(),
            pageSize: dataSource.pageSize(),
            sort: dataSource.sort(),
            group: dataSource.group(),
            filter: dataSource.filter(),
            columns: currentColumnState
        };
     
        return JSON.stringify(state);
    }

    Load State

    function SetDataGrid(data) {
                debugger;
                var result = data.result;
                var jsonResult = $.parseJSON(result);
     
                var state = $.parseJSON(jsonResult.Data);
     
                var grid = $("#GridCustomers").data("kendoGrid");
                var options = grid.options;
     
                for (var i = 0; i < state.columns.length; i++) {
                    options.columns[i].hidden = state.columns[i].hidden;
                    console.log(state.columns[i]);
                    if (state.columns[i].hidden == true) {
                        grid.hideColumn(i);
                    }
                    else {
                        grid.showColumn(i);
                    }
                }
     
                options.columns = state.columns;
                options.dataSource.page = state.page;
                options.dataSource.pageSize = state.pageSize;
                options.dataSource.sort = state.sort;
                options.dataSource.filter = state.filter;
                options.dataSource.group = state.group;
     
                grid.destroy();
                $("#GridCustomers").kendoGrid(options);
            }
     

     

    Thanks All

  2. Dimitar
    Admin
    Dimitar avatar
    281 posts

    Posted 22 Sep Link to this post

    Hello,

    I would suggest you to take a look at the Grid Persist state demo, which shows how getOptions and setOptions client-side methods should be used, to persist all Grid options.

    Feel free to contact us again, if you have any questions.

    Regards,
    Dimitar
    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
  3. UI for ASP.NET MVC is VS 2017 Ready
Back to Top