Auto tab out to button from text box

Question

User-2066177896 posted

My issue and code here:

I have a telerik RadNumeric Text Box and a button.  When i enter 6 digit number in the text box, it should auto tab to button.

I am using "OnKeyUp" to achieve this. The first time i type in the 6 digits into the text box, it auto tabs to the button. After that, if i go back to the text box to enter a new number, after entering a single digit, it auto tabs out. It does not wait till i enter 6 digits to tab out.

I can't figure out why it is tabbing out after entering a single digit. 

NOTE: When i load the page the first time, it works good. It tabs out after entering 6 digits. Every subsequent attempt  to enter a number in that text box, it tabs out after single digit.(No new page load involved). Why is it tabbing out after entering single digit

<telerik:RadNumericTextBox ID="txtClientIDSelect" Runat="server" AutoPostBack="false"   
                                DataType="System.Int32" ValidationGroup="Submit"  OnTextChanged="txtClientIDSelect_TextChanged"
                                  MaxLength="6" Width="50px" onkeyup="NumericValue1KeyDown(this,event)"    > 
                            <NumberFormat ZeroPattern="n" AllowRounding="False" DecimalDigits="0" DecimalSeparator="#" GroupSeparator="" 
                                    GroupSizes="6"></NumberFormat>
                                   
                            </telerik:RadNumericTextBox>
                            <asp:RequiredFieldValidator ID="reqClientID" runat="server" ControlToValidate="txtClientIDSelect" ValidationGroup ="Submit"
                    ErrorMessage="ClientID is required." ToolTip="ClientID is required." InitialValue="--Select--"
                    SetFocusOnError="True">*</asp:RequiredFieldValidator>
                           <%-- <asp:TextBox ID="txtClientIDSelect" runat="server"></asp:TextBox>--%>
                            &nbsp;
                            <asp:Button ID="btnSubmitClient" runat="server" Text="SUBMIT" ValidationGroup ="Submit"
                                onclick="btnSubmitClient_Click" />










<script type="text/javascript">
                
            function NumericValue1KeyDown(sender, e) {
            var key = e.keyCode;
            var textCount = 0;
            textCount = document.getElementById('<%= txtClientIDSelect.ClientID %>').value
            //setTimeout(function() { }, 200);
            if(textCount.length >= 6)
            {
             document.getElementById('<%=btnSubmitClient.ClientID %>').disabled = false ;
             document.getElementById('<%=btnSubmitClient.ClientID %>').focus();
            }
            }
</script>

Thanks in Advance

Answer 1

User283571144 posted

Hi rowter,

 Since the telerik plugin is not free, I have created a test demo on my side without using the telerik:RadNumericTextBox, it works well.

So I guess this issue may related with the telerik:RadNumericTextBox control, I suggest you could post this issue on the https://www.telerik.com/forums.

More details about my test demo , you could refer to below codes:

<form id="form1" runat="server">
        <div>
         
            <asp:textbox ID="txtClientIDSelect" Runat="server" AutoPostBack="false"   
                                DataType="System.Int32" ValidationGroup="Submit" 
                                  MaxLength="6" Width="50px" onkeyup="NumericValue1KeyDown(this,event)"    > </asp:textbox>
                           
                <asp:RequiredFieldValidator ID="reqClientID" runat="server" ControlToValidate="txtClientIDSelect" ValidationGroup ="Submit"
                    ErrorMessage="ClientID is required." ToolTip="ClientID is required." InitialValue="--Select--"
                    SetFocusOnError="True">*</asp:RequiredFieldValidator>
                          
                            &nbsp;
                            <asp:Button ID="btnSubmitClient" runat="server" Text="SUBMIT" ValidationGroup ="Submit"  Enabled="false"
                                onclick="btnSubmitClient_Click" />
 
<script type="text/javascript">
                
            function NumericValue1KeyDown(sender, e) {
            var key = e.keyCode;
            var textCount = 0;
            textCount = document.getElementById('<%= txtClientIDSelect.ClientID %>').value
            //setTimeout(function() { }, 200);
            if(textCount.length >= 6)
            {
             document.getElementById('<%=btnSubmitClient.ClientID %>').disabled = false ;
             document.getElementById('<%=btnSubmitClient.ClientID %>').focus();
            }
            }
</script>
 
        </div>
    </form>

Result:

Best Regards,

Brando

Answer 2

User-2066177896 posted

Thanks Brando. Will post in their forum.