Kendo Grid FilterMenu

Question

我想配置我的網格的過濾器菜單，使用「contains」作爲默認的過濾器選項。

這是我的設置。但是這並沒有改變deafult過濾選項（額外的選項按預期工作）！

.Filterable(filter => 
{ 
    filter.Extra(false); 
    filter.Operators(op => 
    { 
     op.ForString(str => 
     { 
      str.Clear(); 
      str.Contains("Contains"); 
     }); 
    }); 
}) 

完整視圖：

@using NursingHomeStock.Resources 
@{ 
    ViewBag.Title = GlobalResources.EmploymentStatus; 
    Layout = "~/Views/Shared/_Layout.cshtml"; 
} 

<h2>@ViewBag.Title</h2> 

@(Html.Kendo().Grid<NursingHomeStock.Models.EmployeeEmploymentStatusViewModel>() 
     .Name("EmploymentStatusGrid") 
     .Columns(columns => 
     { 
      columns.Bound(m => m.EmploymentStatusId).Hidden(); 
      columns.Bound(m => m.FirstName); 
      columns.Bound(m => m.LastName); 
      columns.Bound(e => e.From).Format("{0:dd.MM.yyyy}").EditorTemplateName("Date"); 
      columns.Bound(e => e.To).Format("{0:dd.MM.yyyy}").EditorTemplateName("Date"); 
      columns.Bound(e => e.ContractPercent).ClientTemplate("#=kendo.format(\"{0:p}\", ContractPercent/100)#"); //.EditorTemplateName("NumberPercent"); 
      columns.Bound(e => e.MarginalEmployment) 
       .ClientTemplate("#=(MarginalEmployment) ? '" + GlobalResources.True + 
           "' : '" + GlobalResources.False + 
           "' #") 
       .EditorTemplateName("DropDownListBoolean"); 
      //columns.Bound(e => e.Qualification).ClientTemplate("#=Qualification.Name#"); 
      columns.Bound(m => m.QualificationName);// .Filterable(f => f.Extra(false).Operators(o => o.ForString(s => s.Contains("Contains")))); 
      columns.Command(command => command.Custom(GlobalResources.Edit).Click("App.EmploymentStatus.openEditModal")); 
     }) 
     .ToolBar(toolbar => 
     { 
      toolbar.Template(@<text> 
       <div> 
        <!-- Button trigger modal --> 
        <button class="btn btn-default" onclick="App.EmploymentStatus.openCreateModal('@ViewBag.nursingHomeId')"> 
         <span class="fa fa-plus-circle"></span> @GlobalResources.Create 
        </button> 
        @* 
         <button class="btn btn-default" onclick=" App.EmploymentStatus.saveChanges(); "> 
          <span class="fa fa-save"></span> @GlobalResources.Save 
         </button> 
        *@ 
        @(Html.Kendo().DatePicker() 
          .Name("ForDate") 
          .Value(DateTime.Now) 
          ) 
        @GlobalResources.All <input id="all-employment-statuses" type="checkbox" style="vertical-align: text-bottom;"> 
        <button class="btn btn-default" onclick=" App.EmploymentStatus.refresh(); "> 
         <span class="fa fa-refresh"></span> @GlobalResources.Refresh 
        </button> 
       </div> 
      </text>); 
     }) 
     .Pageable(pageable => pageable 
      .Refresh(true) 
      .PageSizes(new[] {5, 10, 20, 50, 100}) 
      .ButtonCount(5)) 
     .Sortable() 
     // TODO: set default filter operator to [contains] 
     .Filterable(filter => filter 
      .Extra(false) 
      .Operators(op => op.ForString(str => str.Clear() 
      .Contains("Contains") 
      .IsEqualTo("Is equal to") 
      .IsNotEqualTo("Is not equal to")))) 
    .DataSource(dataSource => dataSource 
     .Ajax() 
     .Events(events => events.Error("App.errorHandler")) 
     .Model(model => 
     { 
      model.Id(m => m.EmploymentStatusId); 
      model.Field(m => m.FirstName).Editable(false); 
      model.Field(m => m.LastName).Editable(false); 
     }) 
     .Read(read => read.Action("ReadEmployeeEmploymentStatus", "Employee", new { ViewBag.nursingHomeId}).Data("App.EmploymentStatus.getFilter")) 
     .Sort(sort => sort.Add("LastName").Ascending()) 
    ) 
    .Events(events => events.Edit("App.EmploymentStatus.onEdit")) 
) 



<!-- Modal --> 
<div class="modal fade" id="modal-create-employment-status" tabindex="-1" role="dialog" aria-labelledby="modal-create-employment-status-label" aria-hidden="true"> 
    <div class="modal-dialog"> 
     <div class="modal-content"> 
      <div class="modal-header"> 
       <button type="button" class="close" data-dismiss="modal" aria-hidden="true"><span class="glyphicon glyphicon-remove"></span></button> 
       <h4 class="modal-title" id="modal-create-employment-status-label">@GlobalResources.Create</h4> 
      </div> 
      <div class="modal-body"> 

       <form id="form-create-employment-status" class="form-horizontal" role="form"> 

        <input type="hidden" id="employment-status-id" name="employment-status-id" /> 

        <div class="form-group"> 
         <label for="dropdown-employee" class="col-sm-4 control-label">@GlobalResources.Employee</label> 
         <div class="col-sm-4"> 
          <input class="" id="dropdown-employee" name="employee" required=""/> 
          <span class="k-invalid-msg" data-for="dropdown-employee"></span> 
         </div> 
        </div> 

        <div class="form-group"> 
         <label for="from" class="col-sm-4 control-label">@GlobalResources.From *</label> 
         <div class="col-sm-4"> 
          @(Html.Kendo().DatePicker() 
             .HtmlAttributes(new { required = "" }) 
             .Name("from") 
             .Format("dd.MM.yyyy") 
          ) 
          <span class="k-invalid-msg" data-for="from"></span> 
         </div> 
        </div> 

        <div class="form-group"> 
         <label for="to" class="col-sm-4 control-label">@GlobalResources.To</label> 
         <div class="col-sm-4"> 
          @(Html.Kendo().DatePicker() 
            .Name("to") 
            .Format("dd.MM.yyyy") 
           ) 
          <span class="k-invalid-msg" data-for="to"></span> 
         </div> 
        </div> 

        <div class="form-group"> 
         <label for="marginal-employment" class="col-sm-4 control-label">@GlobalResources.MarginalEmployment</label> 
         <div class="col-sm-4"> 
          <label class="checkbox"> 
           <input id="marginal-employment" type="checkbox" class="" name="marginal-employment"> 
          </label> 
         </div> 
        </div> 

        <div class="form-group"> 
         <label for="amount-of-employment" class="col-sm-4 control-label">@GlobalResources.AmountOfEmployment</label> 
         <div class="col-sm-4"> 
          @(Html.Kendo().NumericTextBox() 
            .IncreaseButtonTitle(GlobalResources.Increase) 
            .DecreaseButtonTitle(GlobalResources.Decrease) 
            .Name("amount-of-employment") 
            //.Format("p") 
            .Format("{0:# \\%}") 
            .Min(0) 
            .Max(100) 
           ) 
         </div> 
        </div> 

        <div class="form-group"> 
         <label for="dropdown-qualification" class="col-sm-4 control-label">@GlobalResources.Qualification</label> 
         <div class="col-sm-4"> 
          <input class="" id="dropdown-qualification" name="qualification" /> 
         </div> 
        </div> 

       </form> 
      </div> 
      <div class="modal-footer"> 
       <button type="button" class="btn btn-default" data-dismiss="modal">@GlobalResources.Cancel</button> 
       <button type="button" class="btn btn-primary" onclick="$('#form-create-employment-status').submit();">@GlobalResources.Save</button> 
      </div> 
     </div> 
    </div> 
</div> 

<script type="text/javascript"> 
    $(document).ready(function() { 
     App.EmploymentStatus.nursingHomeId = '@(ViewBag.nursingHomeId)'; 
    }); 
</script> 

Answer 1

試試這個（刪除過濾不適用於你）：

劍道MVC：

.Filterable(filter => filter 
    .Extra(false) 
    .Operators(op => op 
     .ForString(str => str.Clear() 
     .Contains("Contains") 
     .IsEqualTo("Is equal to") 
     .IsNotEqualTo("Is not equal to") 
    )) 
) 

或者在JavaScript：

filterable: { 
    extra: false, 
    operators: { 
     string: { 
      Contains: "Contains", 
      eq: "Is equal to", 
      neq: "Is not equal to" 
     } 
    } 
} 

請參閱提琴：http://jsfiddle.net/msc20fjn/