Javascript focus () does not focus

Question

Regular text field, user enters a string. Check if there is something in the input, b) that there are no spaces in the input, and c) only integers, no other characters. Then click the "Submit" button. You will notice that I do not use html behavior, there is no onclick in the input, strict separation of Content / Presentation / Behavior.

My HTML:

<form name="basicText" id="basicText" action=""> <p>Enter any ol' integer: <input type="text" id="inputBox" name="inputBox" size="14"/> <input value = "Next...?" type="submit" id="mySubmitBtn" name="mySubmitBtn"/> </p> </form> <script src="js/w1bscript.js" type="text/javascript"></script> 

Note that an external javascript file is added at the end so that all elements can be loaded (without worrying about downloading right now).

JavaScript:

 var myButton1 = document.getElementById("mySubmitBtn"); var myForm1 = document.getElementById("basicText"); var myTextBox = myForm1.inputBox; function submitPress() { if(myTextBox.value.length == 0) { alert("You didn't enter anything! Once more time, with feeling...") basicText.focus(); basicText.select(); } else if(/\s/.test(myTextBox.value)) { alert("Eh... No spaces. Just integers. Try again..."); basicText.focus(); basicText.select(); } else if (isNaN(myTextBox.value)==true) { alert("Eh... Gonna need you to enter ONLY digits this time. kthnx."); basicText.focus(); basicText.select(); } else { // The textbox isn't empty, and there no spaces. Good. alert("you've passed the test!") } } myButton1.addEventListener('click', submitPress, false); 

When I entered the wrong input, the logic works, but the cursor does not focus on the text field, no matter which browser I use.

Fiddle: http://jsfiddle.net/2CNeG/

Thanks Don

Answer 1

You will notice that after you comment on your notification window, you can see your focal work. But there is a solution for this. Try it. I think it should work.

 setTimeout(function() { document.getElementById('inputBox').focus(); }, 0); 

Answer 2

It seems to me that you are focused on your form element; you need to focus on your text fields:

 document.getElementById('inputBox').focus(); 

or myTextBox.focus() in your code.