locked
Textbox shouldn't allow other then numeric,del,backspace RRS feed

  • Question

  • User1126057398 posted
    I am trying to allow textbox as in
    jsfiddle.net/yrshaikh/44pc78pj/
    It's working fine. Only prob is it didn't allow backspace & delete.
    Thursday, February 18, 2016 6:43 AM

Answers

  • User-986267747 posted

    Hi Geetasks,

    It's working fine. Only prob is it didn't allow backspace & delete.

    According to your description, you'd like to allow backspace & delete when you use the textbox control, but in fact, it didn't allow backspace & delete in your textbox control, isn't it? I create a sample with your link and it works fine with IE11. Could your describe your enviroment and share your code with us?

    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="BtnConfirm.aspx.cs" Inherits="GridViewAppear.BtnConfirm" %>
    
    <!DOCTYPE html>
    
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
        <script src="Scripts/jquery-2.1.4.min.js"></script>
        <script type="text/javascript">
      
            $(function () {
    
                $(".allownumericwithdecimal").on("keypress keyup blur", function (event) {
                    //this.value = this.value.replace(/[^0-9\.]/g,'');
                    $(this).val($(this).val().replace(/[^0-9\.]/g, ''));
                    if ((event.which != 46 || $(this).val().indexOf('.') != -1) && (event.which < 48 || event.which > 57)) {
                        event.preventDefault();
                    }
                });
    
                $(".allownumericwithoutdecimal").on("keypress keyup blur", function (event) {
                    $(this).val($(this).val().replace(/[^\d].+/, ""));
                    if ((event.which < 48 || event.which > 57)) {
                        event.preventDefault();
                    }
                });
    
    
    
            })
        </script>
    </head>
    <body>
        <form id="form1" runat="server">
       
            <span>Float</span>
    
    
    
      <asp:TextBox ID="TextBox1" name="numeric"  CssClass="allownumericwithdecimal" runat="server"></asp:TextBox>
    <div>Numeric values only allowed  (With Decimal Point) </div>    
        <br/>   <br/>   <br/>
        
     <span>Int</span>
    <input type="text" name="numeric" class='allownumericwithoutdecimal' />
    <div>Numeric values only allowed  (Without Decimal Point) </div> 
    
    
          
        </form>
    </body>
    </html>
    

    Best Regards,

    Klein zhang

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Thursday, February 18, 2016 9:43 AM

All replies

  • User-986267747 posted

    Hi Geetasks,

    It's working fine. Only prob is it didn't allow backspace & delete.

    According to your description, you'd like to allow backspace & delete when you use the textbox control, but in fact, it didn't allow backspace & delete in your textbox control, isn't it? I create a sample with your link and it works fine with IE11. Could your describe your enviroment and share your code with us?

    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="BtnConfirm.aspx.cs" Inherits="GridViewAppear.BtnConfirm" %>
    
    <!DOCTYPE html>
    
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
        <script src="Scripts/jquery-2.1.4.min.js"></script>
        <script type="text/javascript">
      
            $(function () {
    
                $(".allownumericwithdecimal").on("keypress keyup blur", function (event) {
                    //this.value = this.value.replace(/[^0-9\.]/g,'');
                    $(this).val($(this).val().replace(/[^0-9\.]/g, ''));
                    if ((event.which != 46 || $(this).val().indexOf('.') != -1) && (event.which < 48 || event.which > 57)) {
                        event.preventDefault();
                    }
                });
    
                $(".allownumericwithoutdecimal").on("keypress keyup blur", function (event) {
                    $(this).val($(this).val().replace(/[^\d].+/, ""));
                    if ((event.which < 48 || event.which > 57)) {
                        event.preventDefault();
                    }
                });
    
    
    
            })
        </script>
    </head>
    <body>
        <form id="form1" runat="server">
       
            <span>Float</span>
    
    
    
      <asp:TextBox ID="TextBox1" name="numeric"  CssClass="allownumericwithdecimal" runat="server"></asp:TextBox>
    <div>Numeric values only allowed  (With Decimal Point) </div>    
        <br/>   <br/>   <br/>
        
     <span>Int</span>
    <input type="text" name="numeric" class='allownumericwithoutdecimal' />
    <div>Numeric values only allowed  (Without Decimal Point) </div> 
    
    
          
        </form>
    </body>
    </html>
    

    Best Regards,

    Klein zhang

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Thursday, February 18, 2016 9:43 AM
  • User1126057398 posted
    Thanks for replying. Now it's working fine.
    Tuesday, February 23, 2016 10:29 AM
  • User1126057398 posted
    In the above it doesnot allows left right arrow. Moreover, in case I type in between then it enters in the end. eg In case 43 is there in textbox and I want to inset 5 in between 4 &3 ie 453 it didn't allows to do the same rather it types 5 in the end and make it 435 rather then 453. Any suggestion how to modify in the above fiddle?
    Tuesday, March 22, 2016 12:15 PM