DropDown alphabet order in grid cell

[rmanevMember]

Hello there,
I have this question: Is there any possibility we can have an alphabet order drop down list into grid cell?

Like in your demo, where we have editable cells, the dropdown solution is always build in random generated order:

var productNames =
[
"Black Tea", "Green Tea", "Caffe Espresso", "Doubleshot Espresso", "Caffe Latte", "White Chocolate Mocha", "Caramel Latte", "Caffe Americano", "Cappuccino", "Espresso Truffle", "Espresso con Panna", "Peppermint Mocha Twist"
];

...

var productindex = Math.floor(Math.random() * productNames.length);

...

row["productname"] = productNames[productindex];

Thank you.

[supportParticipant]

Hi rmanev,

The DropDownList editor does not still have built-in sorting capabilities, but you can sort its items by doing the following:

{ text: 'Product', columntype: 'dropdownlist', datafield: 'productname', width: 177,
    initeditor: function (row, cellvalue, editor) {
        var tmpToString = Object.prototype.toString;
        var items = editor.jqxDropDownList('getItems');
        Object.prototype.toString = function () {
            return this.label
        };
        items.sort();
        Object.prototype.toString = tmpToString;
        $.each(items, function (i) {
            this.index = i;
        });
        editor.jqxDropDownList({ selectedIndex: -1 });
    }
},

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[rmanevMember]

Thanks a lot jQWidgets Team.

Your code is working great, you’re doing fantastic work.
As we have now sorted drop down list inside a grid cell, one more question rise-up:
Is there a way to have a certain option (from the list) selected by default? And if so, is it possible to be one value for each row in the grid?
I hope, I express myself clearly.

Thank You.
Rosen.

Благодаря Петър.

[Peter StoevKeymaster]

Hi Rosen,

To select an item, you can use the jqxDropDownList’s selectedIndex property.

editor.jqxDropDownList({ selectedIndex: -1 });

or the ‘selectIndex’ method.

$("#jqxDropDownList").jqxDropDownList('selectIndex', 0 );

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[Author]

Posts