我使用KendoUI Grid(Web框架).正在从本地json数据填充,该数据在页面加载时从ASP.NET MVC ViewBag加载.我在单元变量中声明数据源,然后网格被初始化并填充来自dataoruce的数据.我遇到过滤器菜单在首次过滤或清除后中断的问题(查看图像).每次我点击过滤器或清除按钮,它会隐藏更多的控件,直到只剩下两个按钮.奇怪的是,控制台中没有报告错误.我一直在处理这个问题超过一个星期,但我似乎找不到任何信息,也没有越来越接近可能的解决方案.

我知道非英语代码可能很难理解,但我很乐意翻译和解释这是什么意思！

不幸的是,我不能提供一个链接到这个页面正在运行的服务器,因为它需要登录,并且页面已经被释放部署,这意味着将公钥放在公共场合不是一个好主意.虽然我一直在努力把一个工作的小提琴组合在一起,但是我一直没能使它奏效.

我正在使用这段代码：

root.seznamDataSource = new kendo.data.DataSource({
  data: zahteveData,pageSize: 15,schema: {
    model: {
      fields: {
        IdZahteve: {
          type: "number"
        },Naslov: {
          type: "string"
        },Datum: {
          type: "date"
        },Status: {
          type: "string"
        },Narocnik: {
          type: "string"
        },PoslovniPartner: {
          type: "string"
        }
      }
    }
  },change: function(e) {
    var urejeniItemi;
    if ((e.sender._sort != null) 
       && (e.sender._sort[0] != null) 
       && e.sender._sort[0].field === "Status") {
      e.preventDefault();
      urejeniItemi = [];
      return $.getJSON("/Zahteve/StatusiData",function(data) {
        var item,status,_i,_j,_len,_len1,_ref;
        for (_i = 0,_len = data.length; _i < _len; _i++) {
          status = data[_i];
          _ref = e.items;
          for (_j = 0,_len1 = _ref.length; _j < _len1; _j++) {
            item = _ref[_j];
            if (item.Status.trim().toLowerCase() === status.Opis.trim().toLowerCase()) {
              urejeniItemi.push(item);
            }
          }
        }
        if (urejeniItemi.length !== e.items.length) {
          console.log("napaka,niso urejeni vsi itemi");
          return;
        }
        if (e.sender._sort[0].dir === "desc") {
          urejeniItemi.reverse();
          return e.items = urejeniItemi;
        }
      });
    }
  }
});

我已经注册了更改事件侦听器,以便我可以应用特定的排序.数据源初始化后,我开始启动KendoUI Grid的初始化：

$("#odprte-zahteve").kendoGrid({
  dataSource: root.seznamDataSource,columns: [
    {
      template: '<span data-idZahteve="#=IdZahteve#"></span>#=Naslov#',field: "Naslov",title: "Naslov zahteve",attributes: {
        style: "min-width: 110px!importnat; text-indent: 10px;"
      },filterable: {
        ui: naslovFilter
      }
    },{
      field: "Datum",title: "Datum zahteve",format: "{0: dddd,dd. MMMM 'yy}",attributes: {
        style: "min-width: 105px!importnat;"
      },filterable: {
        extra: true,ui: function(element) {
          element.kendoDatePicker({
            depth: "month",max: new Date(),format: "dddd,d. MMMM yyyy",ARIATemplate: "#=datumZImenom(data.current)#",footer: "Danes - #=datumZImenom(data)#"
          });
        }
      }
    },{
      field: "Status",title: "Status",attributes: {
        style: "min-width: 60px!importnat;"
      },filterable: {
        ui: statusFilter
      }
    },{
      field: "Narocnik",title: "Naročnik",attributes: {
        style: "min-width: 80px!importnat;"
      },filterable: {
        ui: narocnikFilter
      }
    },{
      field: "PoslovniPartner",title: "Poslovni partner",attributes: {
        style: "min-width: 100px!importnat;"
      },filterable: false,sortable: false
    }
  ],change: function(e) {
    return urediZahtevo(getIzbranaZahteva(this));
  },dataBound: prilagodiSirino,selectable: true,sortable: true,pageable: {
    buttonCount: 5,pageSizes: [15,30,45],messages: {
      display: "Prikazujem {0} - {1} od {2} odprtih zahtev",empty: "Ni podatkov",itemsPerPage: "zahtev na stran",next: "Pojdi na naslednjo stran",first: "Pojdi na prvo stran",prevIoUs: "Pojdi na prejšnjo stran",last: "Pojdi na zadnjo stran",refresh: "Osvežite tabelo"
    }
  },filterable: {
    extra: false,operators: {
      string: {
        eq: "Je enak",startswith: "Se začne z",contains: "Vsebuje"
      },date: {
        lt: "Pred datumom",gt: "Po datumu",eq: "Je enak datumu"
      }
    },messages: {
      and: "in",or: "ali",filter: "Filtriraj",clear: "Počisti",info: "Filtriraj po: ",selectValue: "Izberite kategorijo"
    }
  }
});

过滤器ui功能只是创建基本的过滤器菜单

naslovFilter = function(element) {
    element.kendoAutoComplete({
        dataSource: zahteveData,dataTextField: "Naslov"
    });
};

datumFilter = function(element) {
    element.kendoDatePicker({
        depth: "month",footer: "Danes - #=datumZImenom(data)#"
    });
};

statusFilter = function(element) {
    var item,statusi,_len;
    statusi = [];
    for (_i = 0,_len = zahteveData.length; _i < _len; _i++) {
        item = zahteveData[_i];
        status = item.Status.trim();
        if (!statusi.contains(status)) {
            statusi.push(status);
        }
    }
    element.kendoDropDownList({
        dataSource: statusi,optionLabel: "Izberite status"
    });
};

narocnikFilter = function(element) {
    element.kendoDropDownList({
        dataSource: narocniki,optionLabel: "Izberite naročnika"
    });
};

编辑：我已经开始在这个项目上工作了,经理决定彻底重新设计,所以现在我使用Bootstrap与Angular.js,这不需要使用KendoUI.