How To Destroy AutoComplete Objects in Grid When Grid is Destroyed

5 posts, 0 answers
  1. Shoji
    Shoji avatar
    5 posts
    Member since:
    Mar 2018

    Posted 17 Apr 2019 Link to this post

    Hello

    We are creating a Grid with Razor at the beginning and it creates AutoComplete objects for the column filters that are appended at the end of the document body. The problem is that it is cleared and the Grid itself is regenerated with different data. I destroy the grid object, but the AutoComplete objects at the end of body element are not destroyed. (See attached images.)

    Below is the code:
    var form = $("#LiveCheckExceptionSearchForm");
    $("#search-result").html("");
    $.get(form.attr("action") + "?" + form.serialize(),
    function(result) {
    var grid = $("#liveCheckExceptionSearchResultGrid").data("kendoGrid");
    if (grid) {
    grid.destroy();
    }
    $("#search-result").html(result).show();
    });

    Is there a way?

    Thanks.
  2. Angel Petrov
    Admin
    Angel Petrov avatar
    1153 posts

    Posted 20 Apr 2019 Link to this post

    Hi,

    Generally the destroy method should have resolved that problem. Can you please share with us the grid configuration? 

    Regards,
    Angel Petrov
    Progress Telerik
    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
  3. Shoji
    Shoji avatar
    5 posts
    Member since:
    Mar 2018

    Posted 22 Apr 2019 Link to this post

    This is the code to create the grid:

    <div class="x_content result-grid">
    @(Html.Kendo().Grid(Model)
      .Name("liveCheckExceptionSearchResultGrid")
      .Columns(columns =>
      {
      columns.Bound(c => c.LocationCode).Title("Branch").Filterable(ftb => ftb.Cell(cell => cell.Operator("contains").SuggestionOperator(FilterType.Contains)));
      columns.Bound(c => c.Description).Filterable(ftb => ftb.Cell(cell => cell.Operator("contains").SuggestionOperator(FilterType.Contains)));
      columns.Bound(c => c.Notes).Filterable(ftb => ftb.Cell(cell => cell.Operator("contains").SuggestionOperator(FilterType.Contains)));
      columns.Bound(c => c.SocialSecurityNumber).Title("SSN").Filterable(ftb => ftb.Cell(cell => cell.Operator("contains").SuggestionOperator(FilterType.Contains)));
      columns.Bound(c => c.FirstName).Filterable(ftb => ftb.Cell(cell => cell.Operator("contains").SuggestionOperator(FilterType.Contains)));
      columns.Bound(c => c.LastName).Filterable(ftb => ftb.Cell(cell => cell.Operator("contains").SuggestionOperator(FilterType.Contains)));
      columns.Bound(c => c.IssuedTo).Filterable(ftb => ftb.Cell(cell => cell.Operator("contains").SuggestionOperator(FilterType.Contains)));
      columns.Bound(c => c.CheckNumber).Filterable(ftb => ftb.Cell(cell => cell.Operator("contains").SuggestionOperator(FilterType.Contains)));
      columns.Bound(c => c.LoanNumber).Filterable(ftb => ftb.Cell(cell => cell.Operator("contains").SuggestionOperator(FilterType.Contains)));
      columns.Bound(c => c.ProcessName).Filterable(ftb => ftb.Cell(cell => cell.Operator("contains").SuggestionOperator(FilterType.Contains)));;
      })
      .Pageable()
      .Filterable(filter => filter
      .Mode(GridFilterMode.Row)
      .Operators(operators => operators
      .ForString(str => str.Clear()
      .Contains("Contains")
      .IsEqualTo("Equals")
      .StartsWith("Starts With"))
      .ForDate(date => date.Clear()
      .IsEqualTo("Equals")
      .IsGreaterThanOrEqualTo("Is After")
      .IsLessThanOrEqualTo("Is Before"))
      .ForNumber(number => number.Clear()
      .IsEqualTo("Equals")
      .IsGreaterThanOrEqualTo("Greater Than")
      .IsLessThanOrEqualTo("Less Than"))))  
      .Sortable()
      .Selectable()
      .Resizable(resizing => resizing.Columns(true))
      .Reorderable(reordering => reordering.Columns(true))
      .Events(e => e.DataBound("searchResultDataBound").Page("pageChanged"))
      .DataSource(dataSource => dataSource
      .Ajax()
      .PageSize(5)
      .ServerOperation(false)
      )
      )
    </div>

  4. Angel Petrov
    Admin
    Angel Petrov avatar
    1153 posts

    Posted 24 Apr 2019 Link to this post

    Hello,

    After examining the configuration I noticed that the grid uses mixed binding. It seems that the model holds some values(meaning server-binding is used) and the datasource is configured for ajax binding. Have in mind that this is not supported and may cause some problems. Please reconfigure the grid to use only one type of binding for example ajax binding and check whether this resolves the problem. If not I would kindly like to ask you to create a sample project which we can debug.

    Regards,
    Angel Petrov
    Progress Telerik
    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
  5. Shoji
    Shoji avatar
    5 posts
    Member since:
    Mar 2018

    Posted 28 May 2019 Link to this post

    I am ashamed to say this was my fault in my code. I was clearing the div where the grid was and trying to get and destroy the grid object as you see in the first jQuery code. I fixed the issue and the grid was destroyed along with the filter objects and it is working correctly. Sorry about that. 
Back to Top