How to prevent allowing Caps Letters in JS

Question

User-582711651 posted

Hi Friends, 

Pls ref my below code, in the Mobile phone browser accepts Caps Alphabets, how I prevent allowing Caps Letters?

  $(".numonly").on("keypress keyup blur",function (event) {    
                 $(this).val($(this).val().replace(/[^\d].+/, ""));
                   if ((event.which > 31 && event.which < 48 || event.which > 57)) {
                      event.preventDefault();
                      }
                   });

Thanks in advance. 

Answer 1

User1535942433 posted

Hi ayyappan.CNN,

You could try use this:

 <script>
        $(function () {
            $("#TextBox1").keypress(function (event) {
                $(this).val($(this).val().replace(/[^\d].+/, ""));
                var s = String.fromCharCode(event.charCode);
                if (s.match(/[A-Z]/)) return false;
            })
        })
    </script>

Best regards,

Yijing Sun

Answer 2

User-582711651 posted

Hi ayyappan.CNN,

You could try use this:

 <script>
        $(function () {
            $("#TextBox1").keypress(function (event) {
                $(this).val($(this).val().replace(/[^\d].+/, ""));
                var s = String.fromCharCode(event.charCode);
                if (s.match(/[A-Z]/)) return false;
            })
        })
    </script>

Best regards,

Yijing Sun

Hi Yijing Sun,

Noted, but I want to add this validation in 7 more Template textboxes and 5 more text boxes, hence you may please suggest and share like class="numonly"  or better one

Pls ref my template textbox field (a sample)

<ItemTemplate>
<asp:TextBox ID="txt_VolunteerContrAmt" runat="server" MaxLength="7" BackColor="#99FF99" Width="70px" class="numonly"></asp:TextBox>
</ItemTemplate>

Thanks, 

, 

Answer 3

User1535942433 posted

Hi ayyappan.CNN,

As far as I think,you can't use class to set the keypress event in jquery. I suggest you could each for loop textboxes. Just like this:

<script src="Scripts/jquery-3.2.1.min.js"></script>
    <script>
        $(function () {
            $("input[type=text]").each(function () {
                $(this).keypress(function () {
                    var s = String.fromCharCode(event.charCode);
                    if (s.match(/[A-Z]/)) return false;
                })
            })
        })
    </script>
<asp:TemplateField>
    <ItemTemplate>
       <asp:TextBox ID="TextBox1" runat="server" CssClass="numonly"></asp:TextBox>
     </ItemTemplate>
 </asp:TemplateField>

Best regards,

Yijing Sun

Answer 4

User-582711651 posted

Hi yij sun, 

Noted, one small I think want to share with you, in my Aspx form, need to get Name, Place ie. string fields, and date thru Textboxs, due to this I want to modify the JS, hereby I have modified script and it is mentioned below, request you to please check my below script and suggest.

$(".numonly").on("keypress keyup blur",function (event) { 
var s = String.fromCharCode(event.charCode);
if (s.match(/[A-Z]/)) return false;
}
});

<asp:TemplateField>
    <ItemTemplate>
       <asp:TextBox ID="TextBox1" runat="server" CssClass="numonly"></asp:TextBox>
     </ItemTemplate>
 </asp:TemplateField>

Thanks in advance. 

Answer 5

User1535942433 posted

Hi ayyappan.CNN,

I have told you that you can't use class name to add the event. In your template, there are multiple same class name. So,it can't find which you have pressed.So,your way are wrong. I suggest you use each function.

Best regards,

Yijing Sun

Answer 6

User-582711651 posted

Hi, 

Good, I have added with small a-z with special chars , pls refer 

 if (s.match(/[a-zA-Z-,._+~`!@#$%^&*()]/)) return false;

I want to allow only 0-9 Numeric only.

It works well.