Page Item Count "unselectable"?

9 posts, 0 answers
  1. Craig
    Craig avatar
    11 posts
    Member since:
    Sep 2017

    Posted 15 Jan 2018 Link to this post

    Hey – was looking for a little help. My grid selector to select how many records to show in the grid is disabled and I’m not sure why. What controls the disabling of this drop down (see screen shot attached).It shows “unselectable” in the html..?
  2. Preslav
    Admin
    Preslav avatar
    516 posts

    Posted 16 Jan 2018 Link to this post

    Hello Craig,

    The unselectable attribute is not the cause of this problem because the parent elements are selectable.

    I tried to replicate the scenario and seems that the pager works as expected on my side. Having said that, could you please modify the following test page so it clearly demonstrates the behavior of your project?
    This will help me to fully understand the case. After that, I will be able to eventually provide a workaround/fix.


    Regards,
    Preslav
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  3. Craig
    Craig avatar
    11 posts
    Member since:
    Sep 2017

    Posted 18 Jan 2018 in reply to Preslav Link to this post

    Hi Preslav - thank you for your reply. I did some more research and found that it was indeed not disabled. The list of options for # of results to show is actually being showed off screen to the bottom and quite a ways (20 or greater pixels) from the actual drop down. I'm not sure why that is but is there any way to always make it appear above the drop down instead of below it? Since it's at the bottom of the grid I don't ever want it to popup below itself, it will always be off screen.

     

    Thanks!

    Craig

  4. Preslav
    Admin
    Preslav avatar
    516 posts

    Posted 22 Jan 2018 Link to this post

    Hi Craig,

    Generally speaking, the popup should be displayed on top automatically. For example:
    Having said that, I am not sure what is causing the described faulty behavior.

    However, to force the popup to always show on the top, we could use the approach from this forum:
    For example: 

    var ddl = $(".k-grid-pager [data-role='dropdownlist']").data("kendoDropDownList");
    ddl.popup.setOptions({
      origin: "top left",
      position: "bottom left"
    })
    ddl.popup.options.animation.open.effects = "slideIn:up"

    For a runnable example, check this Dojo:
    I hope this helps.


    Regards,
    Preslav
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  5. Craig
    Craig avatar
    11 posts
    Member since:
    Sep 2017

    Posted 23 Jan 2018 in reply to Preslav Link to this post

    Hi Preslav - thanks for the help. I did try that custom code in document.ready but it doesn't seem to have any impact? Is there somewhere else I can set it. It really seems like the terlerik calcuations of where to place that page item count list is off. I inspected the browser elements and sometimes it's calculating at top 2000? Way off the screen. It's doing it so far off the screen that it causes the browser scroll bar to expand when I don't do anything. Please see the image attached for more details and let me know if you have any other ideas. It feels like the animation container is too blame. I don't need the animation - if I could turn that off maybe that would help?

    Thank you as always!!

    Craig

  6. Preslav
    Admin
    Preslav avatar
    516 posts

    Posted 25 Jan 2018 Link to this post

    Hi Craig,

    You can put the code in the dataBound event handler. However, I assume that if it does not work in the document ready, it won't work in the dataBound either.
    Without replicating the problem, I am out of ideas how it can be fixed. Having said that, it will help me a lot to continue my investigation if you can prepare and share a sample runnable page with dummy data that clearly replicates and isolates the problem. Examining this page locally will help me fully understand the case and eventually I might be able to provide a workaround.


    Regards,
    Preslav
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  7. Craig
    Craig avatar
    11 posts
    Member since:
    Sep 2017

    Posted 30 Jan 2018 in reply to Preslav Link to this post

    Hi Preslav - I have narrowed this down to it being the animations that kick in to slide the dropdown in and the filters, etc. It doesn't always determine the correct placement. This seems to be for all animations from what I've found from searching the web. Is there someway to turn off the animations?

    I also noticed this from someone else which is very similar:

    https://www.telerik.com/forums/positioning-issue-when-dropdownlist-is-near-bottom-of-page

    If I can turn off anything to get this to work better that would be great. Please advise.

    Thanks!

    Craig

  8. Craig
    Craig avatar
    11 posts
    Member since:
    Sep 2017

    Posted 31 Jan 2018 in reply to Preslav Link to this post

    Thank you - that looks great in your sample but doesn't work for me. Already tried that from a previous post you sent. I know it's the animation because the only thing that helps is if I try to override those classes (I've also seen several posts on animation issues). This is what at least helps the animation to appear somewhat decently:

     .k-animation-container {
            position: relative !important;
            top: -80px !important;
        }

    So yes I would like to turn off the animations or set their position as part of the drop down properties when it's initialized? Btw this has to do with ALL animations including the grid filter popups so it's an overall animations issues not just drop down so I need a global solution.

    Thanks,
    Craig

     

     

  9. Preslav
    Admin
    Preslav avatar
    516 posts

    Posted 01 Feb 2018 Link to this post

    Hi Craig,

    To disable all the Kendo UI animations, you could use this internal method:

    kendo.effects.disable()

    We are using the above method for testing purposes, however, I believe in your scenario it will fit the requirements.

    I hope this helps.
        

    Regards,
    Preslav
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Back to Top