劍道電網濾波不工作

Question

這裏是我的MVC視圖代碼： -

<div id="reportsDb"> 

     <div id="grid"></div> 
    <script type="text/x-kendo-template" id="template"> 
      <div class="toolbar" id="template" > 
       <label class="Status-label" for="Status">Show reports by status:</label> 
       <input type="search" id="Status" style="width: 150px"/> 
      </div> 
     </script> 



    <script> 
      $(document).ready(function() { 
       var path = "" 
       dataSource = new kendo.data.DataSource({ 

        transport: { 
         read: { 
          url: "@Url.Action("Report_Read", "Report")", 
          dataType: "json", 
          type: "Get", 
          contentType: "application/json" 
         } 

        }, 

        serverPaging: true, 
        serverSorting: true, 
        serverFiltering: true, 

        pageSize: 10, 
        schema: { 
         model: { 
          id: "RequestId", 
          fields: { 
           IPAddress: { type: "string" }, 
           RequestQuetime: { type: "date" }, 
           RequestPicktime: { type: "date" }, 
           RequestRespondTime: { type: "date" },          
           StatusType: { type: "string" }, 
           RequestTimeDifference: { type: "datetime", format: "{0:hh:mm:ss}" }, 
           RequestPickDifference: { type: "datetime", format: "{0:hh:mm:ss}" } 
          } 
         } 
        } 
       }); 



      var grid = $("#grid").kendoGrid({      
        dataSource: dataSource, 
        sortable: true, 
        pageable: true, 
        filterable: { 
         extra: false, 
         operators: { 
          string: { 
           startswith: "Starts with", 
           eq: "Is equal to", 
           neq: "Is not equal to" 
          } 
         } 
         }, 
        toolbar: kendo.template($("#template").html()), 
        height: 430, 

        columns: [ 
         { field: "IPAddress", title: "IP address", width: 100, filterable: true }, 
         { field: "RequestQuetime", title: "Que time", width: 100, filterable: false }, 
         { field: "RequestPicktime", title: "Pick time", width: 110, filterable: false }, 
         { field: "RequestRespondTime", title: "Respond time", width: 100, filterable: false }, 
         { field: "StatusType", title: "status", width: 110, filterable: { ui: statusFilter } }, 
         { field: "RequestTimeDifference", title: "Time difference", width: 110, filterable: false }, 
         { field: "RequestPickDifference", title: "Pick difference", width: 110, filterable: false } 
        ] 

      }); 

      function statusFilter(element) {     
       element.kendoDropDownList({      
        dataSource: { 
         transport: { 
          read: { 
           url: "@Url.Action("RequestStatus_Read", "Report")", 
           dataType: "json", 
           type: "Get", 
           contentType: "application/json" 
          } 
         } 
        }, 
        dataTextField: "Text", 
        dataValueField: "Value", 
        optionLabel: "--Select Value--" 
       }); 
      } 


      }); 

     </script> 
    </div> 

而且下面是控制器的操作方法： -

public ActionResult Report_Read() 
{   
    return Json(_oRepository.GetReports().ToList(), JsonRequestBehavior.AllowGet); 
} 

我想申請濾波在狀態類型filed.And爲此，我已經綁定這個領域dropdownlist。

而我的問題是，當我試圖通過選擇的狀態從一個下載其無所事事做過濾。

我根據這個例子的工作：

http://demos.telerik.com/kendo-ui/grid/filter-menu-customization

Answer 1

從您的代碼，一切似乎除了控制器讀操作的罰款。現在，如果當您從網格視圖，然後就在你身邊唯一需要改變的，將過濾器的控制器被稱爲低於：

public JsonResult Report_Read([DataSourceRequest] DataSourceRequest request) 
{   
    return Json(_oRepository.GetReports().ToList().ToDataSourceResult(request), JsonRequestBehavior.AllowGet); 
} 

---

編輯：

如果你不這樣做使用Kendo.MVC那麼你有兩個選項來過濾：

選項1：客戶端過濾
- >您將需要得到所有在讀取數據的時候，所以當應用過濾時，您擁有所有數據，如果數據源不大，這是最好的選擇，因爲它可以節省不需要的控制器過濾請求。
- >首先認爲你需要做的是subscirbe filterMenuInit（）的網格，並添加下面的腳本進行客戶端過濾。 代碼：

filterMenuInit: function(e) { 
    if (e.field == "name") { 
      alert("apply Filter"); 
      var filter = [] 
      ... // Generate filters 
      grid.dataSource.filter(filters); 
     } 
    } 

對於詳細的例子：Extact from Kendo Examples

選項2：服務器端篩選
- >我沒有關於它的很多想法，但同時我正在尋找我的過濾選項我遇到了下面的問題，這對我的應用來說很好，但有點複雜。但我認爲你可以使用它。

JS Fiddle Sample

請參考以下鏈接瞭解詳細說明。

參考：JS Kendo UI Grid Options