how to sort columns in alphabetical order in kendo grid header column

Question

My Grid has a column menu, which contains displayed columns sub menu. I want to sort column in alphabetical order in kendo grid list but remember I do not want to sort column header.

I am able to see the columns in alphabetical order but when i tried to Hide any column from column menu it is hiding different column

Below is my code

columnMenu: true,

columnMenuInit:function(e){

              var container = e.container;
              var menu = container.find(".k-menu").data("kendoMenu");
              menu.bind("open", function(e){

                if($(e.item).hasClass("k-columns-item")){

                  var list= container.find('.k-columns-item ul');
                  var items = list.find('li');

                  list.empty();

                  items.each(function(x,y){
                    $(y).removeClass('k-first k-last')
                  });

                  items.sort(function(a,b){
                    a = $(a);
                    b = $(b);

                    var firstText = a.find('input[data-field]').attr('data-field');
                    var secondText = b.find('input[data-field]').attr('data-field');


                    return ((firstText < secondText) ? -1 : ((firstText > secondText) ? 1 : 0));

                  })

                  items.first().addClass('k-first');
                  items.last().addClass('k-last');


                  items.each(function(y,x){
                    list.append($(x));
                  })
                }
              });

Answer 1

This is a known Kendo bug. See the URL below: kendo github issue link