keeping focus on a text field

[laredotornado]

Hello, Assuming I have the functions, "isNumber" and "isEmpty", how
would I write the HTML INPUT type="text" element such that a person
cannot exit the element unless they have typed in a valid number (as
defined by the function isNumber) or left the field empty (as defined
by isEmpty)? Thus, if they have typed in "aaa" and then pressed "Tab"
to go the next element, they'd get a warning message, and be returned
to the old element?

Ideally, this solution would work for both the latest versions of
Firefox and IE.

Thanks, - Dave

 

[deadlyicon]

Ok step one: Keeping someone focused on a text field.

You would this it would be this simple:

<input type="text" onBlur="this.focus();">

but its not, but this works

<input type="text" onBlur=" var that = this; setTimeout(function()
{that.focus();}, 5); ">

seems to work pretty well;

as for your function that checks the input's value it might look
something like this

<input type="text" onBlur="checkMe(this);">

<script>
function checkMe (me) {
if (me.value != 12) {
alert ('ERROR you must enter 12!');
me.focus();
}
}
</script>

 

[Randy Webb]

(e-mail address removed) said the following on 5/28/2006 8:18 PM:

Hello, Assuming I have the functions, "isNumber" and "isEmpty",

I think your isEmpty function would be redundant in this case. If it is
empty, then it can't be a number and isNumber would cover it.

how would I write the HTML INPUT type="text" element such that a person
cannot exit the element unless they have typed in a valid number (as
defined by the function isNumber) or left the field empty (as defined
by isEmpty)?

You use the onSubmit of the form to validate the entire form and notify
of errors then.

<input type="text" onchange="isNumber(this)">

function isNumber(fieldToValidate)
{
//check fieldToValidate.value to see if it
//is a Number or not (whatever you define "Number"
//to be.
if (!validNumber)
{
alert('This is a poorly implemented way to ' +
'keep you from going anywhere else ' +
'because I do not know better');
fieldToValidate.focus();
}
}

If you doubt the alert message, use the tab key and tab through your
form elements.

Thus, if they have typed in "aaa" and then pressed "Tab"
to go the next element, they'd get a warning message, and be returned
to the old element?

See above. But do not fall for the trap of using onblur, use the
onchange event handler.

Ideally, this solution would work for both the latest versions of
Firefox and IE.

And what about Opera, KMeleon, Camino or any other browser? The point
being, don't fall into the "two browser" trap where you think there are
only two browsers to consider.

 

[Randy Webb]

deadlyicon said the following on 5/29/2006 12:08 AM:

Please quote what you are replying to.

If you want to post a followup via groups.google.com, don't use the
"Reply" link at the bottom of the article. Click on "show options" at
the top of the article, then click on the "Reply" at the bottom of the
article headers.

Ok step one: Keeping someone focused on a text field.

That's annoying at best and anti-user friendly at worse.

You would this it would be this simple:

<input type="text" onBlur="this.focus();">

Never use the onblur to validate a field. Use the onchange instead.

but its not, but this works

<input type="text" onBlur=" var that = this; setTimeout(function()
{that.focus();}, 5); ">

seems to work pretty well;

Depending on your definition of "work pretty well"

 

[laredotornado]

Unfortunately, neither "onChange" nor "onBlur" work. Although the
function gets called, if you clic "Tab" the focus changes to the next
text field even if you have some "focus" statement in your function.

- Dave

 

[Dr John Stockton]

JRS: In article <[email protected]>, dated Mon, 29 May
2006 00:30:29 remote, seen in Randy Webb

(e-mail address removed) said the following on 5/28/2006 8:18 PM:

I think your isEmpty function would be redundant in this case. If it is
empty, then it can't be a number and isNumber would cover it.

(A) It would be good practice to use, rather than isEmpty, isBlank, the
latter implying visibly empty.

I was startled, once, by the strange report given by a Web page
checker - it turned out (a) that in copy'n'pasteing the URL I'd
transferred a trailing space, (b) which was not trimmed, (c) but
included in the URL requested, (d) which generated a 404 page,
(e) which was tested, (f) and (IIRC) failed to validate.


(B) But AFAIK isNumber is not standard.

It could be implemented with, say, /[+-]?\d+/, in which case Empty or
Blank would fail; but it could be implemented as

function isNumber(X) { return !isNaN(+X) }

which counts Blank as zero.


One cannot safely assume much about the behaviour of an OP's unquoted
code; and it might be considered useful in some cases for Blank to be
treated as zero..

 

[Randy Webb]

(e-mail address removed) said the following on 5/30/2006 10:59 AM:

Unfortunately, neither "onChange" nor "onBlur" work.

And unfortunately, you haven't learned how to quote what you are
replying to. So here it is, once again:

Please quote what you are replying to.

If you want to post a followup via groups.google.com, don't use the
"Reply" link at the bottom of the article. Click on "show options" at
the top of the article, then click on the "Reply" at the bottom of the
article headers.

<URL: http://www.safalra.com/special/googlegroupsreply/ >

But yes, onchange and onblur do work as intended.

Although the function gets called, if you clic "Tab" the focus
changes to the next text field even if you have some "focus"
statement in your function.

Then show your code because something else in your code is wrong, not in
the basic idea of how to do what you are wanting to do.