focus on textbox using javascript

Question

I would like to focus on textbox according to their arrangement.... my problem is according to my code it direct focus on third textbox.. but i would like to focus according to arrangement of texbox... example if first textbox is blank then it will focus on first textbox, currently it is focusing on third textbox...

<input type="text" id="txtFirst"/>
           <input type="text" id="txtSecond"/>
            <input type="text" id="txtThird"/>
            <input type="button" onclick="check()" value="Check" />
            <script>
                function check() {
                    var err = "";
                    var first = document.getElementById("txtFirst");
                    var second = document.getElementById("txtSecond");
                    var third = document.getElementById("txtThird");
                    if (first.value == "") {
                        first.focus();
                        err = err + "enter the first value";
                    } if (second.value == "") {
                        second.focus();
                        err = err + "enter the second value";
                    } if (third.value == "") {
                        third.focus();
                        err = err + "enter the third value";
                    } }
                </script>

conceptdeluxe · Accepted Answer · 2013-06-22 08:20:24Z

3

When you do the check this way you need else if statements ...

                if (first.value == "") {
                    first.focus();
                    err = err + "enter the first value";
                } else if (second.value == "") {
                    second.focus();
                    err = err + "enter the second value";
                } else if (third.value == "") {
                    third.focus();
                    err = err + "enter the third value";
                }

answered Jun 22, 2013 at 8:20

conceptdeluxe

3,9033 gold badges28 silver badges32 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Pranav Singh · Accepted Answer · 2013-06-22 08:22:20Z

I think in your case all the text box are blank & you are not using else in other if statements so the focus is on last/ third one. Please add else & other if case like:

<input type="text" id="txtFirst"/>
           <input type="text" id="txtSecond"/>
            <input type="text" id="txtThird"/>
            <input type="button" onclick="check()" value="Check" />
            <script>
                function check() {
                    var err = "";
                    var first = document.getElementById("txtFirst");
                    var second = document.getElementById("txtSecond");
                    var third = document.getElementById("txtThird");
                    if (first.value == "") {
                        first.focus();
                        err = err + "enter the first value";
                    } else if (second.value == "") {
                        second.focus();
                        err = err + "enter the second value";
                    } else if (third.value == "") {
                        third.focus();
                        err = err + "enter the third value";
                    } }
                </script>

Vivek Sadh · Accepted Answer · 2013-06-22 08:29:09Z

0

if (first.value == "") {
                        first.focus();
                        err = err + "enter the first value";
                    } if (second.value == "") {
                        second.focus();
                        err = err + "enter the second value";
                    } if (third.value == "") {
                        third.focus();
                        err = err + "enter the third value";
                    } }

In the above code if all textbox are empty it will go on evaluating the if condition from top to bottom and finally the third textbox will receive focus. You need to use else if as others are suggesting.

answered Jun 22, 2013 at 8:29

Vivek Sadh

4,2683 gold badges35 silver badges55 bronze badges

Collectives™ on Stack Overflow

focus on textbox using javascript

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related