onChange

**dmZiggy** · 10-29-2009, 07:29 PM

All,

I have a questions with onChange with some dummy code below:

function checkVal(lcInput) {
if(lcInput.value!="") { var lcValueHold = lcInput.value; alert("You're invalid"); lcInput.focus(); lcInput.value=lcValueHold; lcInput.select(); return false; }
}

where used:
<input type="text" name="Maturity_From" size="9" maxlength="12" value="MM/DD/YYYY" onfocus="this.value=''" onchange="checkVal2(this)" />

my goal: if invalid text (right now it's just any text in the field is invalid), I want to keep the cursor inside the field with the text highlighted.

It works really nice in all browsers with the RETURN key, but not the TAB. The script runs with the alert, and the text selected, but the cursor goes to the next field.

I don't want it to go to the next field but stay inside the field if the text is invalid. I can't use onblur.

Any suggestions?

Thanks.

**chrishirst** · 10-29-2009, 07:38 PM

Code:

if(!value){
    document.formname.fieldname.focus();
}

**dmZiggy** · 11-02-2009, 11:58 AM

Thanks.

This still doesn't work. I tried it in all the browsers.

What I'm trying to do is on the tab, return the focus back to the field/input I'm coming out of. Instead, the validation goes but the tab advances to the next field/input...which is NOT what I want it to do.

I noticed on the "onchange", the return will keep you in the field. Is there anyway with a function I can turn a return into a tab?

**chrishirst** · 11-02-2009, 12:03 PM

So it's not when the value of the field changes then, it's when the user EXITS the field which is the onblur() event.

(blur being the opposite of focus)

**dmZiggy** · 11-04-2009, 06:01 PM

Thanks Chris, but it's still not working.

It's baffling the heck out of me. I made it simplier code. What it does in IE is that it gives the field focus again, but then I can't click into the URL address.

For all the other browsers (FF, Chrome, etc), it does nothing. It doesn't give the focus.

HTML:
<form name="formA">
<input type="text" value="MM/DD/YYYY" onblur="checkValue(this.value)" id="valueBox" name="valueBox" />
</form>

JAVASCRIPT:
function checkValue(value){
if(value!=""){ document.formA.valueBox.focus(); }
}

I don't understand why it's not working to return the focus back to the field.

**chrishirst** · 11-04-2009, 06:46 PM

With the code you have posted you will never exit the ValueBox unless it is empty. Your logic says IF valueBox is NOT empty return focus to valueBox.

**dmZiggy** · 11-06-2009, 05:10 PM

Thanks Chris.

I found this piece of code that also did what I wanted. I wanted to share this with everyone. It works with "onchange" and "onblur".

function focusField() {
if (field2focus) field2focus.focus();
}
function validRequired(formField)
{
var result = true;

if (formField.value != ""){

if (formField.value < 40 || formField.value > 300) {
alert('Weight must be greater than 40kg and less than 300kg');
field2focus=formField;
setTimeout('focusField()',10);

return false;
}

rePhoneNumber =/^\d+$/;

if (!rePhoneNumber.test(formField.value)) {
alert("Phone Number Must Be Numeric");
field2focus=formField;
setTimeout('focusField()',10);

return false;
}
}

return result;
}
</script>
</head>

<body>
<input type="text" name="valueBox" id="valueBox" onblur="validRequired(this)" /><br />
<input type="text" name="valueBox2" id="valueBox2" onblur="validRequired(this)" />