This is a migrated thread and some comments may be shown as answers.

Scrolling does not seem to work for listbox on IE 11?

8 Answers 175 Views
ListBox
This is a migrated thread and some comments may be shown as answers.
Edward
Top achievements
Rank 1
Edward asked on 20 Feb 2019, 08:03 PM

Have listbox... 

Works fine... chrome, edge... but on IE 11 scrolling does not seem to work... have to use the up/down arrows...

 

@(Html.Kendo().DropDownList()
                            .Name("admin_tableName")
                            .DataTextField("Text")
                            .DataValueField("Text")
                            .OptionLabel("- Select -")
                            .DataSource(source => source
                                .Custom()
                                .Transport(transport => transport
                                    .Read(read => read.Action("GetTableNames", "Admin"))
                                )
                            )
                            .HtmlAttributes(new { style = "width: 100%" })
                            .Events(e => e.Change("admin_tablename_change"))
            )

8 Answers, 1 is accepted

Sort by
0
Edward
Top achievements
Rank 1
answered on 21 Feb 2019, 08:09 PM

I.e. the scrolling on the listbox itself works, but what doesn't seem to work is the mouse's scroll wheel that doesn't seem to do anything...

0
Tsvetomir
Telerik team
answered on 22 Feb 2019, 03:04 PM
Hi Edward,

Based on the provided information and screenshot I conducted a few tests and it appears that the DropDownList widget's scrolling works as expected. Actually, you have stated that a Kendo UI ListBox is used, however, the provided code snippet and a screenshot are for a DropDownList. Which of the widgets is in use? 

I have investigated the screenshot and I assume that the widget is not nested within another widget, am I correct?

In order for me to provide suggestions on how to deal with the faulty behavior, I would need a sample in which the issue can be replicated. Moreover, it would be very helpful if you provide additional details concerning the set-up you have on your side. For example, screenshots of the whole page, the widgets of use and code snippets.


Best regards,
Tsvetomir
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.
0
Edward
Top achievements
Rank 1
answered on 23 Feb 2019, 03:35 AM
<div class="k-content">
    <div class="row" style="margin-top: 15px">
        <div class="col-md-6">
            @(Html.Kendo().DropDownList()
                            .Name("admin_tableName")
                            .DataTextField("Text")
                            .DataValueField("Text")
                            .OptionLabel("- Select -")
                            .DataSource(source => source
                                .Custom()
                                .Transport(transport => transport
                                    .Read(read => read.Action("GetTableNames", "Admin"))
                                )
                            )
                            .HtmlAttributes(new { style = "width: 100%" })
                            .Events(e => e.Change("admin_tablename_change"))
            )
        </div>
        <div class="col-md-1" style="padding-left: 0; margin-left: -10px">
            @(Html.Kendo().Button()
                            .Name("refresh_tableName")
                            .IconClass("k-icon k-i-refresh")
                            .Events(e => e.Click("refresh_tableName_click"))
            )
        </div>
    </div>
    <div class="row" style="margin-top: 20px">
        <div class="col-md-7">
            @await Component.InvokeAsync("Admin")
        </div>
    </div>
</div>
0
Accepted
Tsvetomir
Telerik team
answered on 26 Feb 2019, 02:30 PM
Hi Edward,

Based on the provided declaration I have created a sample project which I used to conduct several tests upon. Unfortunately, I could not replicate the described faulty behavior. I have tested it in Internet Explorer with version 11.540.15063.

Can you modify the attached sample to reproduce the issue and send it back to me? This would enable me to debug the case locally and get back to you with suggestions on how to deal with the problem.

Looking forward to your reply.


Best regards,
Tsvetomir
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.
0
Edward
Top achievements
Rank 1
answered on 27 Feb 2019, 05:56 PM
Sorry.  Had a piece of javascript that was working on Edge/chrome but was causing the issue on IE 11.  Had suspected it and had tried commenting this out earlier, but apparently the js file was  cached and was still affecting IE 11.  Retried taking it out and works not on IE 11.
0
Edward
Top achievements
Rank 1
answered on 27 Feb 2019, 06:00 PM

On a side note: what the javascript was to prevent the dropdown from closing automatically when user mouse wheels all the way to the end or all the way to the top.  Kind of annoying because the select options are long and found user wheels to get to the last item in the list and the dropdown auto closes if user does not slow down toward the last item... (same for going up)

 

Is there a built in way to prevent dropdown from auto closing?

0
Accepted
Tsvetomir
Telerik team
answered on 28 Feb 2019, 11:25 AM
Hi Edward,

In order to prevent the DropDownList widget's closing on scroll, apply the approach demonstrated in the following article:

https://docs.telerik.com/kendo-ui/controls/editors/dropdownlist/how-to/appearance/prevent-close-on-scroll#prevent-popup-closure-on-scroll

Since this example uses JavaScript to achieve this functionality, it can be applied for the ASP.NET MVC wrappers as well. Simply, retrieve the widget's instance and call the function:

$(document).ready(function () {
    var widget = $("#tableName").data("kendoDropDownList");
    stopScroll(widget.ul.parent());
});

Should I consider the issue with the scrolling inside the drop-down list's content as resolved?


Best regards,
Tsvetomir
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.
0
Edward
Top achievements
Rank 1
answered on 28 Feb 2019, 04:05 PM
That works.  Thnks.
Tags
ListBox
Asked by
Edward
Top achievements
Rank 1
Answers by
Edward
Top achievements
Rank 1
Tsvetomir
Telerik team
Share this question
or