Focusing the cursor to the first text box of Each row

Collapse
X
 
  • Time
  • Show
Clear All
new posts
  • jayaprakashbojja
    New Member
    • Feb 2007
    • 8

    Focusing the cursor to the first text box of Each row

    Hi,

    I wrote the code to generate a new row each time when i press tab in the
    second text box in a row of two text boxes. It's working fine. But my problem is
    in the new row that is created when i press tab, the cursor should be in the first
    text box. I wrote the code for that. It's line 10 and 11.
    It's not working. Please let me know the solution.
    More over when i press tab in the 2nd text box of first row the cursor is going to
    second text box of second row and when i press tab from the second text box of
    second row the cursor is not at all seen.
    I spent a lot of time on this.


    Thanks in advance.
    The html file is below.


    <html>
    <head>
    <script>
    var numOfLines = 2;
    function generateRow()
    {
    var d=document.getE lementById("div ");
    d.innerHTML += "<input type='text' name='quantity" +numOfLines+"'> &nbsp&nbsp";
    d.innerHTML += "<input type='text' name='itemCode" +numOfLines+"' onkeydown='if(e vent.keyCode==9 ){generateRow() ;}'><br>" ;
    var felement = eval("document. forms[0].quantity"+numO fLines);
    felement.focus( );
    numOfLines += 1;
    }

    </script>
    </head>
    <body>
    <form>

    Quantity &nbsp&nbsp ItemCode<br>
    <input type=text name="quantity1 " >
    <input type="text" name="itemcode1 " onkeydown="if(e vent.keyCode==9 ) {generateRow(); }">

    <div id="div"></div>
    </form>
    <body>
    </html>
  • dmjpro
    Top Contributor
    • Jan 2007
    • 2476

    #2
    look... try to avoid overriding the default behaviour of browser ...

    try to add onle line at the end of the generateRow function ...
    then check it out

    return false;

    actually sometimes i also fail to stop default behaviour of the browser.
    return false means stop the default behaviour of the browser


    welcome in advance

    Comment

    • jayaprakashbojja
      New Member
      • Feb 2007
      • 8

      #3
      Hi,

      I added
      return false;
      to the above code. It works for the 2nd line, but not for the 3rd line onwards.

      Comment

      • iam_clint
        Recognized Expert Top Contributor
        • Jul 2006
        • 1207

        #4
        hi this should need no javascript look for help in html forum for tabindex.

        Comment

        • jayaprakashbojja
          New Member
          • Feb 2007
          • 8

          #5
          Focusing the cursor to the first text box of Each row

          Hi,

          I wrote the code to generate a new row each time when i press tab in the
          second text box in a row of two text boxes. It's working fine. But my problem is
          in the new row that is created when i press tab, the cursor should be in the first
          text box. I wrote the code for that. It's line 10 and 11.
          It's not working. Please let me know the solution.
          More over when i press tab in the 2nd text box of first row the cursor is going to
          second text box of second row and when i press tab from the second text box of
          second row the cursor is not at all seen.
          I spent a lot of time on this.


          Thanks in advance.
          The html file is below.


          <html>
          <head>
          <script>
          var numOfLines = 2;
          function generateRow()
          {
          var d=document.getE lementById("div ");
          d.innerHTML += "<input type='text' name='quantity" +numOfLines+"'> &nbsp&nbsp";
          d.innerHTML += "<input type='text' name='itemCode" +numOfLines+"' onkeydown='if(e vent.keyCode==9 ){generateRow() ;}'><br>" ;
          var felement = eval("document. forms[0].quantity"+numO fLines);
          felement.focus( );
          numOfLines += 1;
          }

          </script>
          </head>
          <body>
          <form>

          Quantity &nbsp&nbsp ItemCode<br>
          <input type=text name="quantity1 " >
          <input type="text" name="itemcode1 " onkeydown="if(e vent.keyCode==9 ) {generateRow(); }">

          <div id="div"></div>
          </form>
          <body>
          </html>

          Comment

          • dmjpro
            Top Contributor
            • Jan 2007
            • 2476

            #6
            plz tell me indetails where added return false ... and i don't understand ur answer ...... i think i can figure u out why it happens

            Comment

            • dmjpro
              Top Contributor
              • Jan 2007
              • 2476

              #7
              u already posted this code and some responses come ....plz check them out

              Comment

              • jayaprakashbojja
                New Member
                • Feb 2007
                • 8

                #8
                Hi,
                At line number 15, i added
                return false;
                The code is below.


                <html>
                <head>
                <script>
                var numOfLines = 2;
                function generateRow()
                {
                var d=document.getE lementById("div ");
                d.innerHTML += "<input type='text' name='quantity" +numOfLines+"'> &nbsp&nbsp";
                d.innerHTML += "<input type='text' name='itemCode" +numOfLines+"' onkeydown='if(e vent.keyCode==9 ){generateRow() ;}'><br>" ;
                /*
                var felement = eval("document. forms[0].quantity"+numO fLines);
                felement.focus( );
                */
                numOfLines += 1;
                return false;
                }

                </script>
                </head>
                <body>
                <form>

                Quantity &nbsp&nbsp ItemCode<br>
                <input type=text name="quantity1 " >
                <input type="text" name="itemcode1 " onkeydown="if(e vent.keyCode==9 ) {generateRow(); }">

                <div id="div"></div>
                </form>
                <body>
                </html>

                Comment

                • dmjpro
                  Top Contributor
                  • Jan 2007
                  • 2476

                  #9
                  good to see someone trying ......

                  Now add return false ... in two places .... instead of at the last of generateRow() function.

                  1. d.innerHTML += "<input type='text' name='itemCode" +numOfLines+"' onkeydown='if(e vent.keyCode==9 ){generateRow() ;return false;}'><br>" ;

                  2.<input type="text" name="itemcode1 " onkeydown="if(e vent.keyCode==9 ) {generateRow(); return false;}">

                  try ittt ...

                  best of luck .....

                  Comment

                  • jayaprakashbojja
                    New Member
                    • Feb 2007
                    • 8

                    #10
                    hi,

                    Still it's not working. I am using IE7.

                    Comment

                    • acoder
                      Recognized Expert MVP
                      • Nov 2006
                      • 16032

                      #11
                      Threads merged. Please do not double post.

                      Comment

                      Working...