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

Problem with scroll top after after read new data

1 Answer 64 Views
ComboBox
This is a migrated thread and some comments may be shown as answers.
Mariusz
Top achievements
Rank 1
Mariusz asked on 01 Jul 2015, 10:10 AM

Hello,

I've noticed in version 2014 Q3 combobox doesn't scroll top after read new data, in version 2015 Q1 always after read scroll is on top. I need the same solution in version 2015 Q1 as this (topic from forum).

01.(function ($, kendo) {
02.            var ExtendedComboBox = kendo.ui.ComboBox.extend({
03. 
04.                _pager: null,
05.                _scrollTop: null,
06. 
07.                init: function (element, options) {
08.                    var that = this;
09. 
10.                    //set combobox defaults
11.                    that.options.placeholder = "Select";
12.                    that.options.autoBind = false;
13.                    that.options.highlightFirst = true;
14.                    that.options.suggest = true;
15.                    that.options.filter = "contains";
16. 
17.                    kendo.ui.ComboBox.fn.init.call(that, element, options);
18. 
19.                    if (options.loadOnDemand) {
20.                        var that = this;
21. 
22.                        if (options.itemsPerRequest != null) {
23.                            this.options.itemsPerRequest = options.itemsPerRequest;
24.                        }
25. 
26.                        that.dataSource.options.serverFiltering = true;
27.                        that.dataSource.options.serverPaging = true;
28.                        that.dataSource.options.serverSorting = true;
29.                        that.dataSource._take = this.options.itemsPerRequest;
30. 
31.                        if (this.options.virtualScrolling == true) {
32.                            $('ul', this.list).scroll(this, this.scroll);
33.                        }
34. 
35.                        $('a.k-link', this._pager).css({
36.                            cursor: 'pointer'
37.                        }).click(function (e) {
38.                            e.preventDefault();
39.                            var items = that.dataSource.view().length;
40.                            var total = that.dataSource.total();
41.                            if (total != items) {
42.                                that._scrollTop = $('ul', that.list).scrollTop();
43.                                that.dataSource.pageSize(that.dataSource.pageSize() + that.options.itemsPerRequest);
44.                            }
45.                        });
46.                        this.list.append(this._pager);
47. 
48.                    }
49.                },
50.                options: {
51.                    name: "ExtendedComboBox",
52.                    loadOnDemand: false,
53.                    itemsPerRequest: 20,
54.                    virtualScrolling: false
55.                },
56.                refresh: function () {
57.                    kendo.ui.ComboBox.fn.refresh.call(this);
58. 
59.                    if (this._scrollTop != null) {
60.                        $('ul', this.list).scrollTop(this._scrollTop);
61.                        this._scrollTop = null;
62.                    }
63.                },
64.                open: function () {
65.                    this.refresh();
66.                    kendo.ui.ComboBox.fn.open.call(this);
67.                },
68.                scroll: function (e) {
69.                    var scrollTop = $(e.currentTarget).scrollTop();
70.                    if (e.data._scrollTop != null) return;
71.                    if (scrollTop + $(e.currentTarget).height() >= $(e.currentTarget)[0].scrollHeight - 1) {
72.                        var items = e.data.dataSource.view().length;
73.                        var total = e.data.dataSource.total();
74.                        if (total != items) {
75.                            e.data._scrollTop = scrollTop;
76.                            e.data.dataSource.pageSize(e.data.dataSource.pageSize() + e.data.options.itemsPerRequest);
77.                        }
78.                    }
79.                }
80.            });
81. 
82.            kendo.ui.plugin(ExtendedComboBox);
83.        })(window.kendo.jQuery, window.kendo);

Thanks.

1 Answer, 1 is accepted

Sort by
0
Georgi Krustev
Telerik team
answered on 03 Jul 2015, 07:39 AM
Hello Mariusz,

Since this question is related to a custom functionality that is not related to the built-in functionality of the widget, I will leave this thread open for the community to provide additional insights.

Regards,
Georgi Krustev
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
Tags
ComboBox
Asked by
Mariusz
Top achievements
Rank 1
Answers by
Georgi Krustev
Telerik team
Share this question
or