Setting focus( ) after an alert box 1

GaryCam · Jan 30, 2004

I have a text field named "zip" in a form. If the user neglects to enter a zipcode before clicking the button that calls this function, the alert box appears. Upon dismissing the alert box I want the focus to be on the 'zip' text field. I want the user to see that blinking cursor. Why won't this function work? Does it have to do with trying to set focus to a blank field? I'm using IE6 & NS7.

function checkzip() {
if (document.form1.zip.value == "&quot

{
alert("You forgot to enter your zipcode&quot

;
document.form1.zip.focus();
return false;
} else {
document.form1.submit();
}
}

Thanks, Gary

Einstein47 · Jan 30, 2004

I am using IE6 and I am doing exactly what you desire without any problems.

The only difference is that I use a variable for the form element like this:

Code:

var form = document.form1;
if (form.zip.value == &quot;&quot;)
{
  alert(&quot;Zip is a required field.&quot;);
  form.zip.focus();
}
else
{
  form.submit();
}

I dont think that issuing the focus() method on a variable would be any different, but you never know.

Also, if there is any JavaScript errors, then IE will stop processing. Nice security "feature". I like to turn on the "Display every script error." so that I can be informed when a JavaScript error happens that may be completely unrelated to the code I'm working on, but will have dire consequences on the execution of my code.

Good luck,

Einstein47
("Tribulations are God's megaphone to awaken a deaf world." - C.S. Lewis)

GaryCam · Jan 30, 2004

Thanks, Albert. I tried your suggestion but as you suspected, it did not make any difference. There must be something else going on here. I did notice this time that upon dismissing the alert box the screen jumps back to the top of the form before returning to the area containing the zip field. Funny how it would make the zip field visible as if it were the focus, but not put the cursor in it!?!

~ Gary

Kendel · Jan 30, 2004

Hey Gary,

You won't see the "zip" get focused it it is a dwopdown. Is this "zip" a dropdown or a textbox?

calamus · Jan 30, 2004

What other code are you executing on your page, because if it's popping back to the top of the page, it sounds like you are "submitting" the page and it's refreshing.

if you have a submit button, and you are clicking that, then the form will submit unless you are returning false to the onsubmit event handler.

Kevin

jemminger · Feb 1, 2004

i read in a recent post that your <input> element needs to have a "tabindex" attribute for focus() to work correctly

=========================================================
-jeff

http://www.jeffemminger.com

try { succeed(); } catch(E) { tryAgain(); }

BillyRayPreachersSon · Feb 1, 2004

Jeff: I read much the same about the blur() event, certainly in IE, anyway.

Gary: Failing Jeff's suggestion of adding a tabindex to your input, can you post your complete code (don't forget to enclose it in

Code:

code]

Code:

[/

Code:

code]

tags...)

Dan

GaryCam · Feb 3, 2004

I do have a tabindex assigned. Here's the code I have:

Code:

<HEAD>
function getship() {
  var form = document.frmModify;
  if (form.ship.value == &quot;&quot;) {
    alert(&quot;Please enter your zip.&quot;);
    form.ship.focus();
  } else {
    form.submit();
  }
} 
</HEAD>
</BODY>
<INPUT type=&quot;text&quot; name=&quot;ship&quot; tabindex=&quot;15&quot; value=&quot;<% = Session(&quot;zip&quot;) %>&quot;>
<INPUT type=&quot;image&quot; name=&quot;update&quot; src=&quot;calcshipping.gif&quot; border=&quot;0&quot; tabindex=&quot;16&quot; width=&quot;131&quot; height=&quot;30&quot; align=&quot;top&quot; alt=&quot;Calculate Shipping&quot; onClick=&quot;getship();&quot;>
</BODY>

BillyRayPreachersSon · Feb 3, 2004

Gary,

You have no

Code:

<script>

tag, no open

Code:

<body>

tag, and no

Code:

<form>

tag. I'm surprised the code runs at all (in fact, if you run the code you gave, you get the JS code onscreen!)...

Here's a fix:

Code:

<HEAD>
<script type=&quot;text/javascript&quot;>
function getship() {
var form = document.frmModify;
  if (form.ship.value == &quot;&quot;) {
    alert(&quot;Please enter your zip.&quot;);
    form.ship.focus();
    return(false);
  } else {
    return(true);
  }
}
</script>
</HEAD>
<BODY>
<form name=&quot;frmModify&quot;>
<INPUT type=&quot;text&quot; name=&quot;ship&quot; tabindex=&quot;15&quot; value=&quot;<% = Session(&quot;zip&quot;) %>&quot;>
<INPUT type=&quot;image&quot; name=&quot;update&quot; src=&quot;calcshipping.gif&quot; border=&quot;0&quot; tabindex=&quot;16&quot; width=&quot;131&quot; height=&quot;30&quot; align=&quot;top&quot; alt=&quot;Calculate Shipping&quot; onClick=&quot;return(getship());&quot;>
</form>
</BODY>

Hope this helps,

Dan

BillyRayPreachersSon · Feb 3, 2004

Sorry - I should have mentioned...

The reason the focus() command wasn't effective, is because the image click will automatically submit the form, causing the page to be reloaded.

The modifications I made cause that submission to be cancelled, and thus the focus will work (well.. it always did work, you just couldn't see it as the page reloaded ;o)

Dan

GaryCam · Feb 3, 2004

Sorry, Dan. I should have mentioned that <script> & <form> tags were omitted from my post for brevity. The two closing </BODY> tags was my typo.

Thanks for your help.

~ Gary

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Setting focus( ) after an alert box 1

GaryCam

Programmer

Einstein47

Programmer

GaryCam

Programmer

Kendel

Programmer

calamus

Programmer

jemminger

Programmer

BillyRayPreachersSon

Programmer

GaryCam

Programmer

BillyRayPreachersSon

Programmer

BillyRayPreachersSon

Programmer

GaryCam

Programmer

Similar threads

Part and Inventory Search

Sponsor