what about angular js?

Amazing! I am happy this made it into this release. This is the main reason why my company chose to upgrade there out-of-date kendo-razor controls. Keep up the good work!

What happened to the paging support for Q1 2015? 

We are happy this is planned for Q1 2015. It looks like it is not explicitly mentioned on the road map even though it is a popular request.

@Kenshin - is DropDownList also targeted for Q1 2015?

Thanks Darian! I took your extension and converted it to a kendo extension. Really only want to load a page at a time and just append the results but I will take what I can get.

http://jsfiddle.net/merganser/g8d6afes/

This would be a great addition because, as you can see from other comments here, it is a very common requirement.
IMHO its current lack shows how much Kendo UI is behind the UI for ASP.NET AJAX in functionality. 
The Kendo team should stop adding new widgets for a while and start adding missing functionalities to the existing ones.

+1

+1

My previous post exceed 5000 characters, so here goes two functions missing:

function scroll(e) {
            var scrollTop = $(e.currentTarget).scrollTop();
            if (e.data._scrollTop != null) return;
            if (scrollTop + $(e.currentTarget).height() >= $(e.currentTarget)[0].scrollHeight - 1) {
                var items = e.data.dataSource.view().length;
                var total = e.data.dataSource.total();
                if (total != items) {
                    e.data._scrollTop = scrollTop;
                    e.data.dataSource.pageSize(e.data.dataSource.pageSize() + e.data.options.itemsPerRequest);
                }
            }
        }

        function unbind() {
            this.unbind('requestEnd', unbind);
            this._filter = null;
        }

And this is how the combo can be extended:

define(['kendo/kendo.combobox.min', 'widgets/lookup'], function (kendo, lookup) {
    var base = new lookup(kendo.ui.ComboBox, 'ExtComboBox');

    var ExtComboBox = kendo.ui.ComboBox.extend(base);
    kendo.ui.plugin(ExtComboBox);
});

Hi all,

I recently needed this feature so I make a base widget (called lookup widget) with this functionality that allow to extend for other widgets (autocomplete, dropdown, multiselect). I made this inside a durandal app, so this is a requirejs module, here's the base code:

define(['kendo/kendo.pager.min'],
    function(kendo) {
        var Widget = function(baseClass, widgetName) {
            return {
                _pager: null,
                _scrollTop: null,
                init: function(element, options) {
                    baseClass.fn.init.call(this, element, options);

                    if (options.loadOnDemand) {
                        var that = this;
                        if (options.itemsPerRequest != null) {
                            this.options.itemsPerRequest = options.itemsPerRequest;
                        }

                        this._pager = $('<div class="k-pager-wrap k-grid-pager k-widget"><span class="caret"></span> <span class="info"></span></div>');
                        this._pager.css({
                            'text-align': 'center'
                        });
                        $('span.caret', this._pager).css({
                            cursor: 'pointer'
                        }).click(function (e) {
                            e.preventDefault();
                            var items = that.dataSource.view().length;
                            var total = that.dataSource.total();
                            if (total != items) {
                                that._scrollTop = $('ul', that.list).scrollTop();
                                that.dataSource.pageSize(that.dataSource.pageSize() + that.options.itemsPerRequest);
                            }
                        });
                        this.list.append(this._pager);
                        if (this.options.virtualScrolling == true) {
                            $('ul', this.list).scroll(this, scroll);
                        }
                    }
                },
                options: {
                    name: widgetName,
                    loadOnDemand: false,
                    itemsPerRequest: 10,
                    virtualScrolling: false
                },
                setDataSource: function (dataSource) {
                    dataSource._take = this.options.itemsPerRequest;
                    baseClass.fn.setDataSource.call(this, dataSource);

                    var that = this;
                    if (that._selectedValue != null && that._selectedValue != '' && this._filter == null) {
                        dataSource.bind('requestStart', function(e) {
                            e.preventDefault();
                            this.bind('requestEnd', unbind);
                            this.query({
                                filter: {
                                    field: that.options.dataValueField,
                                    operator: 'eq',
                                    value: typeof that._selectedValue == "number"
                                        ? parseFloat(that._selectedValue)
                                        : that._selectedValue
                                },
                                pageSize: that.options.itemsPerRequest
                            });
                            this.unbind('requestStart', this._events.requestStart[0]);
                        });
                    }
                },
                refresh: function() {
                    baseClass.fn.refresh.call(this);
                    if (this._pager != null) {
                        var listHeight = this.list.height(),
                            ulHeight = $('ul', this.list).height();
                        if (listHeight == ulHeight) {
                            $('ul', this.list).css('height', $('ul', this.list).height() - this._pager.height() - 10);
                        }
                        var items = this.dataSource.view().length;
                        var total = this.dataSource.total();
                        $('span.info', this._pager).html(items + ' ' + kendo.format(kendo.ui.Pager.prototype.options.messages.of, total));
                    }
                    if (this._scrollTop != null) {
                        $('ul', this.list).scrollTop(this._scrollTop);
                        this._scrollTop = null;
                    }
                }
            };
        }

        return Widget;
    });

Hope this helps, and maybe the dev team can include in next release.

Greetings,
Darian

I would want to have better control over how often it connects to the server for server-side paging. Here are some functionality that I need in a combo box.

Do not automatically open the drop down results until the user explicitly opens it herself using the mouse, or by pressing the down arrow key.

Do not automatically select values from the results when the user uses the arrow keys to navigate up and down the list.

Select results on space bar press (similar to GRID row selection) or mouse click (or double click? ... maybe), and only update actual value when the user manually selects a result.

Close the results list when user presses the "up" arrow key, and there are no more previous results. In other words, if the first result in the list is highlighted (but again, NOT selected) and the user presses the up arrow, the results list window will close.

Allow option to automatically close drop down results when the input changes.

Only initiate server read when the drop down list opens.

Continue to allow values in text input box to be different than any results.

IE8 compatible (yes ... I know ...sigh).

When looking at whether or not we would renew our contract, this is the one factor, this one lack of feature, that will stop us from buying again.

I would suggest to have this virtual scroll option to controls like dropdown, combobox and auto complete  

+1 Would be brilliant!

as the data is more and it is very important to have the virtual scrolling.

IF not paging allow a list limit to be set, OData support it. then the user just needs to add more text to get a shorter list

Hi Praveen,
Could you please give us a sample code of server side too?..
Really need that..

Hi all,

I implemented on virtual scrolling but not paging. Here a sample code


            <div>Year</div>
            <div>
                @(Html.Kendo().ComboBox()
          .Name("CMB_Year")
          .Filter("contains")
           .HtmlAttributes(new { style = "width:250px" })
          .Placeholder("please select")
          .DataTextField("Text")
          .DataValueField("Value")
          .DataSource(source =>
              source.Read(read =>
                      {
                          read.Url("http://localhost:8080/api/Controller/GetYears").Data("UpdateParameters");
                      }).ServerFiltering(true)).Events(e=>e.Open("combobox_open"))
          .HighlightFirst(true)
          .IgnoreCase(true)
          .AutoBind(false)
          .Suggest(true)
    )
            </div>
        
    <script type="text/javascript">

        var startRowNumber = 0;
        function UpdateParameters(sender, e, args, obj) {
            var filterText = null;
            if (sender.filter != undefined) {
                startRowNumber=0;
                filterText = sender.filter.filters[0].value.trim();
            }
                return {
                    prefix: filterText,
                    year: ($("#CMB_Year")[0].value != "") ? $("#CMB_Year")[0].value : null,
                    startitems : startRowNumber;
                }
            } 
	
        function combobox_open(sender,e) {
           $("#" + $(this)[0]._optionID.split('_option_selected')[0]).data("kendoComboBox").dataSource.read();
        }

        $(function () {

            $("#CMB_Year_listbox").scroll(function (e) {
               
                debugger;
                var scrollHeight = e.target.scrollHeight;
                var currentHeight = e.target.scrollTop;

                
                if ((scrollHeight / 2) < currentHeight)
                {
				startRowNumber=startRowNumber+50;//next 50 records
                    $("#" + $(this)[0].id.split('_listbox')[0]).data("kendoComboBox").dataSource.read();
                }
                

            });



        
            //$("#CMB_Year-list").live("scroll", function () { alert(123); });
            //$("#CMB_Year-list").on("scroll", function () { alert(234); });

        });
    </script>
    
        
}

 

Cannot live without it! 

Need !!

Yes. Very much needed

It should be very similar to this http://demos.telerik.com/aspnet-ajax/combobox/examples/populatingwithdata/autocompletesql/defaultcs.aspx

+1 for this. Our kendo UI comboboxes are filled with generic SQL statements that sometimes return more than 200 items. This caused script timeout errors in IE and firefox. A paged/scrolling combobox would definitely help. is this likely to be included in the 2013 Q3 release?

This allows for dealing with moderate datasets in IE8, and unlimited datasets in any browser.  Would definitely love to see this.

This is needed to handle large volumes of data

Yes indeed,  Definitely need this.  If you have server filtering, you need server paging.
Since the items are presented in a scrolling list, the ideal thing, imo, would be to make it virtual so that scrolling down would request the next page(s) as needed. 

This would be a very big help