7

我在剑道网格中应用自定义分页和排序。对于我的专栏之一，我得到了一个数字文本框。当我在数字文本框中插入值时，它是整数，但是当焦点从过滤器数字文本框中移除时，它会转换为十进制。例如：如果我输入 32，它仍然是 32，但随着焦点的移除，该值变为 32.00。但我希望该值保持 32。

所以任何人都可以帮我解决这个问题。

4

9 回答 9

17

你可以像下面这样设置

columns.Bound(x => x.Property).Filterable(x => x.UI("NumericFilter"));

<script type="text/javascript">
function NumericFilter(control) {
    $(control).kendoNumericTextBox({ "format": "n0", "decimals": 0 });

}
</script>

或者使用扩展方法

columns.NumericColumn(x => x.Property);

public static GridBoundColumnBuilder<TModel> NumericColumn<TModel, TValue>(this GridColumnFactory<TModel> Column, Expression<Func<TModel, TValue>> Expression) where TModel : class
{
    return Column.Bound(Expression).Filterable(x => x.UI("NumericFilter"));

}
于 2013-08-21T08:41:37.000 回答
3

我遇到了同样的问题和 columns.Bound(x => x.Property).Filterable(x => x.UI("numericFilter")); 不适合我。小猪支持 Xavier John 的回答我使用 columns.filterable.cell.template 来解决我的问题，因为 Telerik 的文档指出：

columns.filterable.ui 字符串 |函数

过滤器菜单中使用的小部件的角色数据属性或初始化该小部件的 JavaScript 函数。

设置了值选项的列不支持此功能。如果 filterable.mode 设置为 'row'，则应使用 columns.filterable.cell.template 来自定义输入。

http://docs.telerik.com/kendo-ui/api/javascript/ui/grid#configuration-columns.filterable.ui

这是我的代码

    @(Html.Kendo().Grid<UnsoldStockBO.USS_STOCK>()
        .Name("searchGrid")
        .Columns(columns =>
        {
            columns.Bound(c => c.CyAbbrev);
            columns.Bound(c => c.UssCrop).Filterable(filter => filter.Cell(c => c.Template("IntegerFilter")));
            columns.Bound(c => c.TtAbbrev);
            columns.Bound(c => c.PtAbbrev);
            columns.Bound(c => c.UssInternalGrade);
            columns.Bound(c => c.SuggestedPrice).Format("{0:c2}").Filterable(filter => filter.Cell(c => c.Template("NumericFilter")));
            columns.Bound(c => c.UssCtPricePerKilo).ClientTemplate("#:kendo.toString(UssCtPricePerKilo, 'c', Culture)#").Filterable(filter => filter.Cell(c => c.Template("NumericFilter")));
            columns.Bound(c => c.UssNetKilos).Format("{0:n}").Filterable(filter => filter.Cell(c => c.Template("NumericFilter")));
            columns.Bound(c => c.UssWriteDownCount).Format("{0:n0}").Filterable(filter => filter.Cell(c => c.Template("IntegerFilter")));
            columns.Command(command =>
            {
                command.Edit().HtmlAttributes(new { @title = "Quick Edit" });
                command.Custom("EditStock").HtmlAttributes(new { @title = "Edit" });
                command.Destroy().HtmlAttributes(new { @title = "Delete" });
            }).HtmlAttributes(new { @nowrap = "nowrap" });
        })
        .Mobile()
        .ToolBar(toolbar => toolbar.Custom().Text("Add Stock").Action("Create", "Stock").Name("AddStock"))
            .Editable(editable => editable.Mode(GridEditMode.InLine).DisplayDeleteConfirmation("This record will be permanently deleted and cannot be recovered. Are you sure?"))
            .Filterable(ftb => ftb.Mode(GridFilterMode.Row))
            .Sortable()
            .Pageable()
            .Events(e => e.DataBound("onDataBound").Cancel("onCancel"))
        .NoRecords("No records found.")
        .Resizable(resize => resize.Columns(true))
        .DataSource(dataSource => dataSource
            .WebApi()
            .ServerOperation(true)
            .PageSize(30)
                        .Events(events => events.Error("error_handler").Sync("sync_handler"))
                    .Model(model =>
                    {
                        model.Id(p => p.UssId);
                        model.Field(c => c.CyAbbrev).Editable(false);
                        model.Field(c => c.UssCrop).Editable(false);
                        model.Field(c => c.TtAbbrev).Editable(false);
                        model.Field(c => c.PtAbbrev).Editable(false);
                        model.Field(c => c.UssInternalGrade).Editable(false);
                        model.Field(c => c.SuggestedPrice).Editable(false);
                    })
                    .Read(read => read.Url(Url.HttpRouteUrl("DefaultApi", new { controller = "webapi", action = "UnsoldStock_Get", userId = ((UnsoldStockBO.PSI_USER)Session["USS_User"]).UUid })))
                                .Update(update => update.Url(Url.HttpRouteUrl("DefaultApi", new { controller = "webapi", action = "UnsoldStock_Update", userName = ((UnsoldStockBO.PSI_USER)Session["USS_User"]).UUserName })).Type(HttpVerbs.Post))
                                    .Destroy(destroy => destroy.Url(Url.HttpRouteUrl("DefaultApi", new { controller = "webapi", action = "UnsoldStock_Delete", id = "{0}", userName = ((UnsoldStockBO.PSI_USER)Session["USS_User"]).UUserName })).Type(HttpVerbs.Delete))

                )
    )

<script type="text/javascript">

    function IntegerFilter(args) {
        args.element.kendoNumericTextBox({ format: "#", decimals: 0, spinners: false });
    }

    function NumericFilter(args) {
        args.element.kendoNumericTextBox({ spinners: false });
    }

</script>
于 2015-09-30T15:02:30.027 回答
1

将过滤列设置为

column.filterable = {
    ui: numberFilter,
    cell: {
        template: numberFilter,
    }
};

function numberFilter(args) {
    var element = args instanceof jQuery ? args : args.element;
    element.kendoNumericTextBox({
        format: "n0"
    });
}

于 2014-10-31T05:01:28.297 回答
1

Palani Kumar所说的仍然插入分隔符，即将 12345 转换为 12,345；因此，如果您想要没有任何格式的纯数字（无分隔符、无小数点等），我建议您使用以下编辑过的代码。

columns.Bound(x => x.Property).Filterable(x => x.UI("numericFilter"));

<script type="text/javascript">
    function numericFilter(control) {
        $(control).kendoNumericTextBox({ format: "#", decimals: 0 });

    }
</script>
于 2015-08-26T06:00:46.253 回答
0

您可以在列上的可过滤对象上设置格式，如下所示：

            field: "TaskId",
            title: "TaskId",
            width: 80,
            filterable: {
                ui: function (element) {
                    element.kendoNumericTextBox({
                        format: "n0"
                    });
                }
            }

更新 这是 javascript 版本。这是我完整的网格定义：

      $("#uxRunningTasksGrid").kendoGrid({
        dataSource: runningTasksDataSource,
        height: $(document).height() - 280,
        autoBind: true,
        filterable: true,
        sortable: true,
        pageable: false,
        reorderable: true,
        resizable: true,
        columns: [{
            command: { text: "Details", click: openDetails }, title: " ", width: 80
        },
            {
                field: "TaskId",
                title: "TaskId",
                width: 80,
                filterable: {
                    ui: function (element) {
                        element.kendoNumericTextBox({
                            format: "n0"
                        });
                    }
                }
            }
        ]
     };
于 2013-05-22T10:09:17.800 回答
0

对于 asp.net 核心网格： columns.Bound(c => c.Expenditure).Format("{0:#,###.00}").Width(75);

于 2019-06-19T19:10:37.057 回答
0

我在 Kendo UI Filter 中遇到了同样的问题，它对我不起作用。IE：

columns.Bound(x => x.ColumnName).Filterable(x => x.UI("numericFilter"));

但是你可以试试这个：

.DataSource(dataSource => dataSource
.Ajax()
.Model(model =>
{
    model.Id(p => p.ColumnID);       
    model.Field("ColumnName", typeof(string));

})
.PageSize(20)
)
于 2022-02-22T08:43:59.233 回答
-1

只需设置列格式：

c.Bound(x => x.ColumnName).Format("{0:#}");
于 2013-03-07T16:30:54.130 回答
-1

在 Kendo NumericTextBox 上，Format 用于在输入内容未获得焦点时对其进行格式化。当输入焦点集中时，您必须使用小数对输入进行格式化。例如，这里是一个始终显示整数的 NumericTextbox (asp.net)：

@(Html.Kendo().NumericTextBox<decimal>()
        .Name("Total")
        .Format("n0")
        .Decimals(0)
    )

希望它会帮助某人。

于 2014-11-20T14:03:01.450 回答