Изменение формата числового фильтра kendo

Я применяю пользовательские подкачки и сортировку в сетке кендо. Для одного из моих столбцов я получаю числовое текстовое поле. Когда я вставляю значение в числовое текстовое поле, оно целочисленно,но по мере удаления фокуса из числового текстового поля фильтра оно преобразуется в десятичное. Например: если я ввел 32, он остается 32, но по мере удаления фокуса значение становится 32.00. Но я хочу, чтобы это значение оставалось 32.

поэтому любой может пожалуйста помочь мне с решением.

6
asp.net-mvc kendo-grid

7 ответов

Вы можете установить как ниже

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"));

}
12

У меня была та же проблема и столбцов.Граница (x => x.Собственность).Фильтруемая(x => x.UI ("numericFilter")); не работал для меня. Хрюша отступил от ответа Ксавье Джона, я использовал столбцы.фильтрующийся.клетка.шаблон для устранения моей проблемы, потому что документация telerik гласит:

столбцы.фильтрующийся.ui String / Function

атрибут данных роли виджета, используемый в меню фильтра или функции JavaScript, которая инициализирует этот виджет.

эта функция не поддерживается для столбцов, для которых установлен параметр значения. Если фильтруется.режим установлен в 'row', columns.фильтрующийся.клетка.для настройки входных данных следует использовать шаблон.

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

установите столбец фильтра как

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

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

что Палани Кумар сказал все еще вставляет разделители, то есть он преобразует 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>
1

вы можете установить формат для filterable в столбце следующим образом:

            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"
                        });
                    }
                }
            }
        ]
     };
0

просто установите формат столбца:

c.Bound(x => x.ColumnName).Format("{0:#}");
-1

в Kendo NumericTextBox формат используется для форматирования содержимого ввода, когда он не сфокусирован. У вас есть Tu использовать десятичные дроби du формат ввода, когда он сфокусирован. Например, вот NumericTextbox (asp.net) всегда показывать целое число:

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

надеюсь, что это поможет кому-то.

-1