剑道网格过滤器菜单

本文关键字:菜单 过滤器 网格 | 更新日期: 2023-09-27 18:23:49

我想将网格的filtermenu配置为使用"contains"作为默认过滤器选项。

这是我的设置。但这并没有改变deafult filter选项(额外的选项按预期工作)!

.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>

剑道网格过滤器菜单

试试这个(删除不适用于您的过滤器):

剑道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/