Here is a demo to show how to bind data of Model with format 111-111-1111,and when change the input with the format 111-111-1111. Controller: public IActionResult Index() { TestReadOnly t = new TestReadOnly { PhoneNumber = "1231231234" }; return View(t); }View: @model TestReadOnly @{ ViewData["Title"] = "Index"; } <h1>Index</h1> <input asp-for="PhoneNumber" type="tel" aria-label="Please enter your phone number" placeholder="ex. 111-111-1111" onchange="change()"> @section scripts{ <script type="text/javascript"> $(function () { //bind the data from Model with format 111-111-1111 let txt = JSON.stringify(@Model.PhoneNumber); if (String(txt)[3] != "-") { txt = '' + txt.substring(0, 3) + "-" + txt.substring(3, 6) + "-" + txt.substring(6); } $('[type="tel"]').val(txt); }) //when change the input value,format 111-111-1111 function phoneMask() { var num = $(this).val().replace(/\D/g, ''); $(this).val(num.substring(0, 3) +'-'+ num.substring(3, 6) + '-' + num.substring(6, 10)); } $('[type="tel"]').keyup(phoneMask); </script> }result: |