By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
435,619 Members | 1,861 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 435,619 IT Pros & Developers. It's quick & easy.

How to Change Focus to given Form Field

P: n/a
Hi,

I have an HTML page with a FORM and some input fields.
On the fields I wish to do validation as the punters change the field
values.

If they get it wrong, then I tell them and then wish to put
the focus back to the offending field.

( It works if a use an 'onblur' event but not an 'onchange' )
What mean is that the changing focus happens.
The 'onblur' is a pain because if a minimise the window and then bring
it back up, the validation function is called for each box during the
loading.
In practice I may have a form with up to 60 boxes and this would be a bit
of a drag.

eg:
Try the following file and enter an invalid number in either of the
number boxes then use the mouse ( or TAB key )
to move to a new box.
<html>
<head>
<link rel='stylesheet' href='/ripple-order/common/rip.css' />
<title>Submit a Ripple Order</title>

<script language="Javascript">

function validate_generic_numberField( dataRootDetails )
{
alert( "Entered 'validate_generic_numberField' field_name=["
+ dataRootDetails.name + "]" );
// expect dataRootDetails to be either the value of
// document.productDetails or document.serviceDetails
var v = dataRootDetails.value;
var fname = dataRootDetails.name;

var err = 0;
var errtext = "";
if( v.search(/[^0-9\.]/g) != -1 )
{ err = 1;
errtext = "Problem with field [" + fname + "]. \n\nValid chars
for a number field are :\n '0', '1', .., '9' and '.', '+', '-'\n";
}

if( err )
{
alert( errtext );
dataRootDetails.focus();
}
}
</script>
</head>
<body bgcolor="#FFFFFF">

<form>
<table>
<tr>
<td valign="top" class="fdesc">A text field in here</td>
<td><textarea name="TextField1" rows="4"
cols="40"></textarea></td>
<td valign="top" class="ftype">Text</td>
</tr>

<tr>
<td valign="top" class="fdesc">A string field in here</td>
<td><input type="text" name="StringField1" value=""></td>
<td valign="top" class="ftype">String</td>
</tr>
<tr bgcolor="cyan">
<td valign="top" class="fdesc">Try alpha char here then move to
another box ( onblur event )</td>
<Comment>Note. Using the onblur event because the onchange event does not
seem to allow the focus to be re-set back offending field
</Comment>
<td><input type="text" name="numberField1"
onblur="validate_generic_numberField(this)" value="">
</td>

<td valign="top" class="ftype">Number [ ]</td>
</tr>
<tr>
<td valign="top" class="fdesc">Try alpha char here then move to
another box ( onchange event )</td>
<Comment>Note. Using the onblur event because the onchange event does not
seem to allow the focus to be re-set back offending field
</Comment>
<td><input type="text" name="numberField2"
onchange="validate_generic_numberField(this)" value="">
</td>

<td valign="top" class="ftype">Number [ ]</td>
</tr>

</table>
</body>
</html>
Jul 20 '05 #1
Share this Question
Share on Google+
2 Replies


P: n/a
fish wrote:
On the fields I wish to do validation as the punters change the field
values. If they get it wrong, then I tell them and then wish to put
the focus back to the offending field.


I strongly suggest you reconsider. If you try this you'll find a lot of
people type something in to the field, hit tab, then start typing what they
want in the next field. If you hijack the cursor back to the previous field
they'll type over whatever they put.

This means they waste time typing in the wrong box (lots of time if they
don't notice!) and find it much harder to edit whatever they had initially
(e.g. if it was only a minor error, but the zapping forces them to retype
the entire field).

--
David Dorward http://david.us-lot.org/
Redesign in progress: http://stone.thecoreworlds.net/
Microsoft announces IE is dead (so upgrade):
http://minutillo.com/steve/weblog/20...ces-ie-is-dead
Jul 20 '05 #2

P: n/a
On 03.7.10 9:35 AM, fish wrote:
I have an HTML page with a FORM and some input fields.
On the fields I wish to do validation as the punters change the field
values.

If they get it wrong, then I tell them and then wish to put
the focus back to the offending field.


Would you like it if your bank manager asked you to fill in a form and then
looked over your shoulder the whole time pointing out every tiny mistake you
made?

Of course not.

Just wait until the user presses the submit button.

Phil
--
Philip Ronan
ph***********@virgin.net
(Please remove the "z"s if replying by email)
Jul 20 '05 #3

This discussion thread is closed

Replies have been disabled for this discussion.