Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > Javascript > keeping focus on a text field

Reply
Thread Tools

keeping focus on a text field

 
 
laredotornado@zipmail.com
Guest
Posts: n/a
 
      05-29-2006
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

 
Reply With Quote
 
 
 
 
deadlyicon
Guest
Posts: n/a
 
      05-29-2006
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>

 
Reply With Quote
 
 
 
 
Randy Webb
Guest
Posts: n/a
 
      05-29-2006
http://www.velocityreviews.com/forums/(E-Mail 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
comp.lang.javascript FAQ - http://jibbering.com/faq & newsgroup weekly
Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/
 
Reply With Quote
 
Randy Webb
Guest
Posts: n/a
 
      05-29-2006
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.
<URL: http://www.safalra.com/special/googlegroupsreply/ >

> 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"

> as for your function that checks the input's value it might look
> something like this
>
> <input type="text" onBlur="checkMe(this);">


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

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


--
Randy
comp.lang.javascript FAQ - http://jibbering.com/faq & newsgroup weekly
Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/
 
Reply With Quote
 
laredotornado@zipmail.com
Guest
Posts: n/a
 
      05-30-2006
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

 
Reply With Quote
 
Dr John Stockton
Guest
Posts: n/a
 
      05-30-2006
JRS: In article <(E-Mail Removed)>, dated Mon, 29 May
2006 00:30:29 remote, seen in news:comp.lang.javascript, Randy Webb
<(E-Mail Removed)> posted :
>(E-Mail 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.
>


(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..

--
John Stockton, Surrey, UK. ?@merlyn.demon.co.uk Turnpike v4.00 IE 4
<URL:http://www.jibbering.com/faq/> JL/RC: FAQ of news:comp.lang.javascript
<URL:http://www.merlyn.demon.co.uk/js-index.htm> jscr maths, dates, sources.
<URL:http://www.merlyn.demon.co.uk/> TP/BP/Delphi/jscr/&c, FAQ items, links.
 
Reply With Quote
 
Randy Webb
Guest
Posts: n/a
 
      05-30-2006
(E-Mail 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.

--
Randy
comp.lang.javascript FAQ - http://jibbering.com/faq & newsgroup weekly
Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/
 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
javascript validation for a not required field, field is onlyrequired if another field has a value jr Javascript 3 07-08-2010 10:33 AM
Keeping text control characters (line breaks / carriage returns) in DetailsView field Bazza Formez ASP .Net 2 08-06-2007 08:53 PM
this.window.focus() vs. window.focus() vs. this.focus() Roger Javascript 3 03-08-2007 08:53 PM
1.Enter space bar for field names and save the field.The field shoud not get saved and an alert should be there as"Space bars are not allowed" Sound Javascript 2 09-28-2006 02:43 PM
Disable a field keeping text black? harry HTML 1 04-08-2004 09:01 AM



Advertisments