Restrict input text to accept only Arabic characters and Numeric

Question

I am working on an MVC solutions and I want to prevent input text from accepting any characters other than Arabic and Numeric using regular expressions from frontend and backend mvc .

Answer 1

How to Prevent input text from accepting any characters other than Arabic and Numeric using regular expressions ?

To Prevent input text from accepting any characters other than Arabic and Numeric using regular expressions in MVC, you should follow the below steps:

1. Navigate to the _Layout.cshtml file .
2. Add the <script></script> tags below.

MVC Text Box allow only Arabic characters using FrontEnd

1. Open _Layout.cshtml file

2. Add the <script></script> tags below

     $(".arabic-numeric").on("input", function () {
        var inputValue = $(this).val();
        var validChars = /^[0-9\u0600-\u06FF\s]+$/;
   
        if (!validChars.test(inputValue)) {
            // Remove invalid characters
            $(this).val(inputValue.replace(/[^0-9\u0600-\u06FF\s]+/g, ''));
        }
    });
   

3. Add arabic-numeric class to any input type to allow only Arabic character and Numeric

         <div class="mb-3 col-xs-12 col-sm-6 col-md-6 col-lg-6">
          @Html.Label("Resource.Label.JobTitle", new { @class = " form-label", @for = "Position" })
          <span style="color: red;">*</span>
          @Html.TextBoxFor(m => m.Position, new { @class = "form-control arabic-numeric", @maxlength = "250" })
          @Html.ValidationMessageFor(Model => Model.Position, null, new { @class = "text-danger" })
         </div>
   

MVC Text Box allow only Arabic characters and Numeric using BackEnd

1. Open your ViewModel class file
2. Add the public string Position { get; set; } into ViewModel Class

3. Add RegularExpression above property allow only Arabic character and Numeric

          [RegularExpression(@"^[0-9\u0600-\u06FF\s]+$", ErrorMessage ="Arabic and Numeric")]
          public string Position { get; set; }
   

Result :