Wednesday 26 February 2014

How to Move to next textbox in asp.net using javascript



Description:-

            In this example we explain that how to move or transfer focus from one textbox to another textbox in asp.net using javascript.

This is simply process same as we enter the license key when installing any software or install windows xp or any other version of the windows.


In this example when you enter number in first textbox it will automatically move or focus to the second textbox after 4 character.same as when enter number in second textbox it will automatically move or transfer focus to the third textbox after 4 character entering in textbox and same as further textbox and so on.

We all know that all software provide serial key or license key facility.This is real time problem when I was craete a setup in which I want to add this type of facility like automatically move to next textbox after every four character.


To show Example How to insert,update,delete in DataList control clikck here  CRUD operation in DataList 

 How to Bind Excelsheet Data to Gridview CRUD operation in Excelsheet Database

How to Display Layer on one Another in CSS Overlapping Layer in CSS



Serialkey.aspx:-

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="serialkey.aspx.cs" Inherits="serialkey" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <script type="text/javascript">
        function test(t,id)
        {
            if (t.length >= 3) {
              var num= id.slice(-1);
              var id1 = parseInt(num, 10) + 1;
                document.getElementById("t"+id1).focus();
            }
        }
    </script>
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
       
        <asp:TextBox ID="t1" runat="server" onkeypress="javascript:test(this.value,this.id)" Width="40px"  ></asp:TextBox><b>-</b>
        <asp:TextBox ID="t2" runat="server"  onkeypress="javascript:test(this.value,this.id)" Width="40px"> </asp:TextBox><b>-</b>
        <asp:TextBox ID="t3" runat="server"  onkeypress="javascript:test(this.value,this.id)" Width="40px"></asp:TextBox><b>-</b>
        <asp:TextBox ID="t4" runat="server" MaxLength="4" Width="40px"></asp:TextBox>
    </div>
    </form>
</body>
</html>


Serialkey.aspx.cs:-

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

public partial class serialkey : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        if(!Page.IsPostBack)
        t1.Focus();
    }
   
}

0 comments:

Post a Comment