NoRecords() auto height size

5 posts, 1 answers
  1. Rick
    Rick avatar
    9 posts
    Member since:
    Feb 2018

    Posted 10 Jun 2020 Link to this post

    Hi,

    I am experiencing an odd behavior when using the .NoRecords() function of the grid.  If I add .NoRecords() the height of the grid auto sizes to an extreme height beyond the view screen height when there are no records.  If there are records, then the grid auto sizes appropriately.  If I remove .NoRecords() then the grid is collapsed to a reasonable height when no records are available.  I have not had this issue with previous versions.  Using Developer Tools for the browsers I cannot see any .css file that is applying any height value that would be causing this issue.  Is this a known issue, working as intended or am I missing something?

    I am using version 2020.2.513.

    Thanks.

  2. Ivan Danchev
    Admin
    Ivan Danchev avatar
    2153 posts

    Posted 15 Jun 2020 Link to this post

    Hi Rick,

    This is not a known issue. Could you post your Grid declaration, as well as the order of loading the Kendo UI CSS files in the _Layout.cshtml file? Based on that we will try to reproduce the issue and identify what causes it.

    Regards,
    Ivan Danchev
    Progress Telerik

    Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
    Our thoughts here at Progress are with those affected by the outbreak.
  3. Rick
    Rick avatar
    9 posts
    Member since:
    Feb 2018

    Posted 15 Jun 2020 in reply to Ivan Danchev Link to this post

    I have stripped the _Layout down to the bare minimum of css files and the issue is still reproducible. I have attached a screenshot of the css load order as reported by Chrome developer tools.  The page used to reproduce the problem in this is example is PhoneType which is loaded via a javascript ajax call into a named div section.

     

    @(Html.Kendo().Grid<CHART.NetCore.Web.Models.PhoneTypeModel>()
        .Name("gridPhoneType")
        .HtmlAttributes(new { actionURL = Url.Action("DeleteAction", "Configuration"), title = "Phone Type" })
        .Columns(c =>
        {
            c.Bound(f => f.PhoneTypeID).Hidden();
            c.Bound(f => f.Description);
            c.Command(commands =>
            {
                commands.Edit().Text(" ").CancelText(" ").UpdateText(" ").HtmlAttributes(new { title = "Edit Phone Type" });
                commands.Custom("Delete").Text(" ").Click("kendoDestroyRecord").IconClass("fas fa-times").HtmlAttributes(new { title = "Delete Phone Type" });
            }).Width(125);
        })
     
        .ToolBar(toolbar => toolbar.Create().Text(" ").IconClass("fas fa-plus").HtmlAttributes(new { title = "Add New Phone Type" }))
        .Editable(editable => editable.Mode(GridEditMode.InLine))
        .DataSource(dataSource =>
        dataSource
     
        .Ajax()
        .Events(ex => ex.Error("function(e){grid_onDataError(e, '#gridPhoneType')}"))
        .Model(model =>
        {
            model.Id(f => f.PhoneTypeID);
     
        })
        .Sort(sort => sort.Add("Description").Ascending())
        .Create(create => create.Action("GridPhoneTypeAction", "Configuration", new { method = "create" }).Data("sendAntiForgery"))
        .Read(read => read.Action("GridPhoneTypeAction", "Configuration", new { method = "read" }).Data("sendAntiForgery"))
        .Update(update => update.Action("GridPhoneTypeAction", "Configuration", new { method = "update" }).Data("sendAntiForgery"))
        )
        .NoRecords()
        .Pageable(p => p.Info(true))
        .Filterable(filterable => filterable
        .Extra(false)
        .Operators(operators => operators
        .ForString(str => str.Clear()
        .StartsWith("Starts with")
        .IsEqualTo("Is equal to")
        .IsNotEqualTo("Is not equal to")
        .Contains("Contains")
        ))
        )
    )

     

  4. Answer
    Ivan Danchev
    Admin
    Ivan Danchev avatar
    2153 posts

    Posted 18 Jun 2020 Link to this post

    Hi Richard,

    Based on the provided info I've tested the scenario in a sample project. At my end no unexpected resizing of the Grid occurs. The project is attached to this reply. Could you give it a try at your end and modify it accordingly, so that the issue is reproduced? After that, attach it back for further review.

    Regards,
    Ivan Danchev
    Progress Telerik

    Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
    Our thoughts here at Progress are with those affected by the outbreak.
  5. Rick
    Rick avatar
    9 posts
    Member since:
    Feb 2018

    Posted 18 Jun 2020 in reply to Ivan Danchev Link to this post

    I have resolved the issue.  A JavaScript file was being loaded twice.  It was not a Kendo script so I am not sure why it would have caused the issue with the grid but once it was corrected the issue disappeared.

    Thanks for the help.

Back to Top