How to Change Focus to given Form Field

F

fish

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

David Dorward

fish said:
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).
 
P

Philip Ronan

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
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

Forum statistics

Threads
473,744
Messages
2,569,483
Members
44,901
Latest member
Noble71S45

Latest Threads

Top