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); }
Preview:
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