Kendo UI NumericTextBox percentage format

Question

My problem is very similar to what is explained in this question: KendoNumericTextBox percentage formatting

But I'm using ASP.NET MVC Wrappers to render the NumericTextBox.

I have the following editor template to render the Widget:

@model double?
@(Html.Kendo().NumericTextBoxFor<double>(m => m)
.Format("{0:P2}")
.Min(0)
.Max(1)
.Step(0.01)
)

But what is happening is that (examples):

• Value show when widget IS focused: 0.01 -> Value show when widget IS NOT focused: 10,00%
• Value show when widget IS focused: 0.63 -> Value show when widget IS NOT focused: 63,00%
• Value show when widget IS focused: 0,6345 -> Value show when widget IS NOT focused: 63,00%
• Value show when widget IS focused: 5 -> Value show when widget IS NOT focused: 100,00%

What I would like is somethinh like this:

• Value show when widget IS focused: 10 -> Value show when widget IS NOT focused: 10,00%
• Value show when widget IS focused: 63 -> Value show when widget IS NOT focused: 63,00%
• Value show when widget IS focused: 63,45 -> Value show when widget IS NOT focused: 63,45%

but in the database I need to store a value between 0 and 1. This is the reason I have ....Min(0).Max(1)...

How could I achieve this using the MVC Wrapper?

Answer 1

The solution I came up with was:

@(Html.Kendo().NumericTextBoxFor<double>(m => m)
    .Format("##.00 \\%")
    .Min(0)
    .Step(1)
    .Decimals(2)
)

After, in the controller, I convert to [0,1].

Answer 2

would you please try this,

$("#numerictextbox").kendoNumericTextBox({ format: "# '%'" });

for more information find this link

http://dojo.telerik.com/AKODe or Click Here

Answer 3

Use this format for your widget

@(Html.Kendo().NumericTextBoxFor<double>(m => m)
    .Format("#.## '%'")
    .Min(0)
    .Max(1)
    .Step(0.01)
)

add more '#' behind '.' to have more decimals.