防止 kendo 网格过滤器出现负值

Question

我在 asp.net mvc 项目中有这个 kendo 网格

<div class="actualGrid" id="actualGrid">
    @(Html.Kendo().Grid<AVNO_KPMG.Models.Bench>()    //Bench Grid
            .Name("grid")

        .Columns(columns =>
        {
            columns.Bound(p => p.name).Title("Bench").Filterable(ftb => ftb.Cell(cell => cell.Operator("startswith"))).Width(100);
            columns.Bound(p => p.freeSeats).Title("Free Seats").Width(200).Filterable(ftb => ftb.Cell(cell => cell.Operator("gte"))).HtmlAttributes(new { @class = "FreeSeats" })
                .ClientTemplate("<div class='barthingy'><div class='bars_text'><div class='seatsText'><span class=\"bookfull\"></span> <b>#=bookedSeats#</b> USED SEATS</div><div class='seatsText'><span class=\"bookNotfull\"></span> <b>#=freeSeats#</b> TOTAL OF SEATS</div></div><div id='bigbar'><div  class='bigbar'  style='width:100%; float:left; background-color:rgb(142, 188, 0);'><div  ' style='float:right; width:#=bookedSeats *100 / seatsCount#%; background-color:rgb(255, 99, 71); height:16px '  class='b_#=name#' id='temp-log'></div></div></div></div>");

        })
        .Pageable()
        .Sortable()
        .Scrollable(scrolling => scrolling.Enabled(false))
                .Filterable(ftb => ftb.Mode(GridFilterMode.Row))
                .Events(events => events.DataBound("onDataBound").FilterMenuInit("filterInit"))
        .DataSource(dataSource => dataSource
        .Ajax()
        .PageSize(10)
        .Events(events => events.Error("error_handler"))
        .Model(model => model.Id(p => p.id))
                        .Read(read => read.Action("GetBenches", "Deskcheckin"))
                )
        )
</div>

我想知道是否有办法阻止过滤器接受负值（即使我们按下箭头，当值为 0 时）。我尝试将其添加到网格的输入中

$(".actualGrid :input").attr("onkeypress", "return event.charCode >= 48 && event.charCode <= 57");

但它只是防止用户输入负值，他仍然可以使用箭头。

编辑：

我按照下面的建议创建了这个函数

function filterInit(e) {
        console.log("FILTER INIT!");
        if (e.field == "Free Seats") {
            //depends of how many inputs you have per filter
            $(e.container.find("input:eq(1)")).kendoNumericTextBox({
                min: 0
            });                        
        }
    }

但还是不行:\

我试着用 jQuery

$(".actualGrid :input:eq(4)").kendoNumericTextBox({
            min: 0
        });

效果好一点，如果我使用键盘上的箭头，它不会低于 0，但如果我单击输入右侧的箭头，它仍然会变为负数

Answer 1

您可以使用 filterMenuInit。

  heigth:...,
  filterable: true,
  filterMenuInit: function (e) {
                    if (e.field == "YourField") {
  //depends of how many inputs you have per filter
                       $(e.container.find("input:eq(1)")).kendoNumericTextBox({
                            min: 0
                        });                        
                    }
    },
   sortable: true,

防止 kendo 网格过滤器出现负值

Prevent negative values on kendo grid filter

asp.net-mvc

kendo-ui

kendo-grid

kendo-asp.net-mvc

kendo-ui-grid