Question

我想实现以下目标：应在Kendo NumericTextBox中编辑百分比值（在模型中表示，例如“0.7”表示70％）。 NumericTextBox的“P”格式的正常行为是，当您编辑值时，它显示“0.7”，当查看值时，它显示“70％”。现在在我们的场景中，我们想要在编辑值时显示“70”（而不是“0.7”）。

我发现Kendo NumericTextBox不支持此行为。当然，我可以使用自定义格式，例如“格式：'＃。00 \％'” - 但在这种情况下，模型值必须是“70”表示70％而不是“0.7”......

我找到了以下方法来定义一个新的“百分比”绑定，它可以正确地进行转换：http://boniestdeveloper.net/post/2013/04/16/Editing-percentage-values-with-a-KendoUI-NumericTextBox.aspx。现在我想在自定义小部件“kendoNumericPercentageTextBox（）”中封装此绑定，其行为与“kendoNumericTextBox（）”相同，但呈现“百分比”绑定。

任何人都可以给我一个提示，我如何定义这样一个呈现自定义绑定并扩展kendoNumericTextBox小部件的小部件？

Answer 1

我知道这是一个老问题，但现在可以通过factor option开箱即可实现：

指定值乘以的因子。获得的结果用作编辑值。因此，如果在NumericTextBox中输入15作为字符串并且因子值设置为100，则视觉值将为1500.在blur上，视觉值将除以100，从而将窗口小部件值缩放为原来的比例。

示例：

$("#numerictextbox").kendoNumericTextBox({
   format: "p0",
   factor: 100,
   min: 0,
   max: 1,
   step: 0.01, 
   change: function() {
     console.log(this.value());
   }
});

JSfiddle：https://jsfiddle.net/qs4jnLqs/3/

KendoNumericTextBox百分比格式

1 个答案: