How to get the cursor position in TextBox while entering text in Textbox with JQuery and Asp.net


Introduction :

In this tutorial i will explain you how to check the mouse position in the textbox while text in entering. Here i explain with the help of JQuery. Here i use textbox to enter the text, and JQuery 1.7. I will be showing the position by alert.Here mouse position count starts as Whole numbers i.e,( 0,1,2,3,4,.............)

JQuery coding :                                                                          
 <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.min.js"></script>

<script>    new function ($) {
        $.fn.getCursorPosition = function () {
            var pos = 0;
            var el = $(this).get(0);
            // IE Support
            if (document.selection) {
                el.focus();
                var Sel = document.selection.createRange();
                var SelLength = document.selection.createRange().text.length;
                Sel.moveStart('character', -el.value.length);
                pos = Sel.text.length - SelLength;
            }
            // Firefox support
            else if (el.selectionStart || el.selectionStart == '0')
                pos = el.selectionStart;
            return pos;
        }
    } (jQuery);
    $(document).ready(function () {
        $("#txt").keypress(function () {
            alert($("#txt").getCursorPosition());
        });

    });
</script>

Aspx coding :                                                                                   

<body>
    <form id="form1" runat="server">
    <div>
             <asp:TextBox ID="txt" runat="server"></asp:TextBox>
    </div>
    </form>
</body>


Overall Coding after integrating JQuery and Aspx.                     


<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="mousepositionkeypress.aspx.cs" Inherits="MastereventstoClient.mousepositionkeypress" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script>    new function ($) {
        $.fn.getCursorPosition = function () {
            var pos = 0;
            var el = $(this).get(0);
            // IE Support
            if (document.selection) {
                el.focus();
                var Sel = document.selection.createRange();
                var SelLength = document.selection.createRange().text.length;
                Sel.moveStart('character', -el.value.length);
                pos = Sel.text.length - SelLength;
            }
            // Firefox support
            else if (el.selectionStart || el.selectionStart == '0')
                pos = el.selectionStart;
            return pos;
        }
    } (jQuery);
    $(document).ready(function () {
        $("#txt").keypress(function () {
            alert($("#txt").getCursorPosition());
        });

    });
</script>


</head>
<body>
    <form id="form1" runat="server">
    <div>
    <asp:TextBox ID="txt" runat="server"></asp:TextBox>
    </div>
    </form>
</body>
</html>