Kendo dropdownlist search filter is not accepting special characters in javascript

2 posts, 0 answers
  1. Kendo
    Kendo avatar
    1 posts
    Member since:
    Jun 2018

    Posted 06 Jun 2019 Link to this post

    I am using Kendo dropdownlist with server side filtering using jquery in mvc,i'm facing one issue like when i type any special character like ? &  ‘  - ..etc,the filter is not working

    I have tried to debug the code in backend, in Request.Params.Get("filter[filters][0][value]") the value is getting null 

    is there any setting to filter special characters in search filter? please let me know 

    below is the code that i have used.

                placeholder: "Select",
                dataTextField: "Text",
                dataValueField: "Id",
                filter: "contains",
                filtering: function (e) {
                    var filter = e.filter;

                    if (filter != undefined && !filter.value) {
                        //prevent filtering if the filter does not value
                noDataTemplate: 'No Data!',
                height: 290,
                virtual: {
                    itemHeight: 26,
                    valueMapper: function (options) {
                            url: '../controller/valueMapper',
                            type: "GET",
                            dataType: "jsonp",
                            success: function (data) {
                dataSource: {
                    transport: {
                        read: {
                            type: "POST",
                            url: "../controller/getdata",
                            dataType: "json",
                        parameterMap: function (options) {
                            return options;
                    schema: {
                        data: 'data',
                        total: 'total',
                        fields: [
                            { field: 'Id', type: 'number' },
                            { field: 'Text', type: 'string' }

                    pageSize: 44,
                    serverPaging: true,
                    serverFiltering: true
                dataBound: function (e) {
                    //prevent the click event for disabled ones
                    $(".optiondisable").parent().css("background-color", "#E4E6E9");
                    //var listContainer = e.sender.list.closest(".k-list-container");
                    //listContainer.width(listContainer.width() +;

  2. Dimitar
    Dimitar avatar
    764 posts

    Posted 10 Jun 2019 Link to this post


    In general, you should be able to filter with the specified special characters with the following configuration:
        $(document).ready(function () {
                filter: "startswith",
                dataTextField: "CategoryName",
                dataValueField: "CategoryId",
                dataSource: {
                    serverFiltering: true,
                    transport: {
                        read: {
                            url: "/Home/ReadCategories",
                            data: function (e) {
                                var filterText = $("#products").getKendoDropDownList().filterInput.val();
                                return { text: filterText }

    The method passes an additional parameter "text" with each request. Thus, you could filter based on the received value in the remote end-point as follows:
    public ActionResult ReadCategories(string text)
      var categories = GetCategories().Where(c => c.CategoryName.Contains(text));
      return Json(categories, JsonRequestBehavior.AllowGet);

    Progress Telerik
    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Back to Top