[SOLVED] onBlur and forms

[hungryOrb]

HellO!

How you feelings? good,.

So I have this problem:

I must validate an input when the element with the input loses focus (onBlur), and so far, I have this:

 

<script language="Javascript">
function briefValidator()
{
var desc = document.getElementById('briefdesc');
if (desc == NULL || desc == ""){
	alert ("You should really enter a Brief Description..");
	elem.focus('briefdesc');
	/*document.location = "submitnewjob.php";*/
}
}

 

and HTML:

 

<form onsubmit='formValidator()' name="input" action="insert.php" method="post" >
<b><font color='ffffff'>Brief Description(Mandatory):</font></b></td><td class=two>
<input type="text" name="brief" size="25" id="briefdesc" onblur="briefValidator()">

 

I'm a big noob, so would appreciate any tips! THANKYOU in advance! <3

[obsidian]

Try this instead:

 

JavaScript:

function briefValidator(ele)
{
var desc = ele.value;
if (desc == NULL || desc == ""){
	alert ("You should really enter a Brief Description..");
	elem.focus('briefdesc');
	/*document.location = "submitnewjob.php";*/
}
}

 

HTML:

<input type="text" name="brief" size="25" id="briefdesc" onblur="briefValidator(this);" />

[hungryOrb]

obsidian <3

Thankyou for replying. I tried the solution, but it didn't quite work. I'm expecting it to run the script when I tab out of that elem or click in another or whatever, I am expecting the right thing.. right?

[obsidian]

obsidian <3

Thankyou for replying. I tried the solution, but it didn't quite work. I'm expecting it to run the script when I tab out of that elem or click in another or whatever, I am expecting the right thing.. right?

 

Yes, that is the expected result. Try this and see if it helps:

HTML:

<input type="text" name="brief" id="my_brief" />

 

JavaScript:

window.onload = function()
{
  var ele = document.getElementById('my_brief');
  ele.onblur = function()
  {
    if (this.value == '')
    {
      alert('You should really enter a description for this one');
      this.focus();
    }
  }
}

[hungryOrb]

Thanks again ;] It nearly completely works!

The only thing, is that it doesnt refocus, pressing tab will bring up the alert, but not keep focus on that element.

=)

[obsidian]

Maybe, rather than the this.focus() line, you can do this line instead:

document.getElementById('my_brief').focus();

[hungryOrb]

Thanks for reply Obs hm, that doesn't want to work either though. I think both lines are correct syntax, and it probably tries to focus, but when the alert box is up, the rest of the code just gets wasted and doesn't run. I think we could probably put a lot of code after it, and it would all get ignored, unless the processing speed is so slow that we can click ok on the alert box before the rest of the code runs.. :] But I'm not good at JS, so its just a gut feeling :/

[hungryOrb]

Of course, it's preferrable that all the validation checks onSubmit, but that refuses to work also ;]

[obsidian]

...but when the alert box is up, the rest of the code just gets wasted and doesn't run.

 

Ugh... I hadn't even realized what I did. you need to move the focus() before the alert pops up. When a regular JS dialog box is up, the focus is on that, and the script won't run. Try setting the focus to the box first and then doing the popup and see if that helps.

[hungryOrb]

That makes it loop, strangely. I don't understand why that would make it loop...

I settled for this instead using onSubmit:

 

<script>
function validateString(field, msg, min, max) {
if (!min) { min = 1 }
if (!max) { max = 65535 }

if (!field.value || field.value.length < min ||  
field.value.max > max) {
alert(msg);
field.focus();
field.select();
return false;
}

return true;
}
</script>

 

I got this from http://www.sitepoint.com/article/form-validation-client-side/2.

I don't think onBlur is very effective :'(