InputNumber Formatting

Use the InputNumber's format property to format numbers as they are edited, making them easy to read.

The syntax of the format parameter is similar to the one used in .NET and is documented here.







1
2
3
4
5
6
7
8
9
// This file locates: "Scripts/Lesson/C1Input/InputNumberFormatting.js".
c1.documentReady(function () {
    var formats = 'n0,n2,c0,c2,p0,p2'.split(',');
    for (var i = 0; i < formats.length; i++) {
        var fmt = formats[i];
        var theNumber = wijmo.Control.getControl('#theInputNumberF' + fmt);
        theNumber.format = fmt;
    }
});
1
2
3
4
5
6
7
8
9
10
11
12
13
using System.Web.Mvc;
 
namespace LearnMvcClient.Controllers
{
    public partial class C1InputController : Controller
    {
        // GET: InputNumberFormatting
        public ActionResult InputNumberFormatting()
        {
            return View();
        }
    }
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
@{
    var formats = new[] { "n0", "n2", "c0", "c2", "p0", "p2" };
}
 
<h1>
    @Html.Raw(Resources.C1Input.InputNumberFormatting_Title)
</h1>
 
<p>
    @Html.Raw(Resources.C1Input.InputNumberFormatting_Text1)
</p>
<p>
    @Html.Raw(Resources.C1Input.InputNumberFormatting_Text2)
</p>
<div id="inputNumbers" class="demo-settings">
    @foreach (var format in formats)
    {
        var id = "theInputNumberF" + format;
        <label for="@id">@string.Format(Resources.C1Input.InputNumberFormatting_Text3, format) </label>
        @Html.C1().InputNumber().Id(id)
        <br />
    }
</div>
 
<script>
 
</script>