Preview:
function grid_product_filter(element) {
    build_gridfilter(element, '/Products/GridFilterRead');
}


function build_gridfilter(element, url) {
   
    var combobox = element.kendoComboBox({

    placeholder: "Select",
    autoBind: true,
    filter: "contains",

        dataTextField: "Name",
        dataValueField: "Name",

        dataSource: {
            type: "aspnetmvc-ajax",
            sort: { field: "Name", dir: "asc" },
            transport: {
                read: {
                    url: url,
                }
            },
            schema: {
                data: "Data",
                total: "Total"
            },
            pageSize: 200,
            serverPaging: true,
            serverFiltering: true,
            serverSorting: true
        }
    });
    setdropdownwidth(combobox);
}
var standardfilterwidth = 300;
function setdropdownwidth(combobox) {
    if (combobox.data("kendoComboBox"))
        combobox.data("kendoComboBox").list.width(standardfilterwidth);
    else if (combobox.data("kendoExtendedComboBox"))
        combobox.data("kendoExtendedComboBox").list.width(standardfilterwidth);
}



downloadDownload PNG downloadDownload JPEG downloadDownload SVG

Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!

Click to optimize width for Twitter