Validation Text Area To Dont Let Insert Emails Or Website Links

[madness69]

Hello there, im trying to validate in input text are but i liked to dont let the user insert emails or website links, and for this i think ill do this based in charecters or words like "@" and ".com,.org,etc.." How can i make it in my code?

Here is my code

 

if(document.getElementById("presentation").value.length < 10)
{
document.getElementById("presentation").style.border = '1px solid red';
alert('You cannot insert emails or website links.');
return false;
}
else
{
document.getElementById("presentation").style.border = '1px solid green';

return true;
}

 

Best regards

Edited October 30, 2012 by madness69

[trq]

You do realise that using Javascript to do this means that users can simply bypass your checks?

[Iluvatar+]

By all means use front-end validation for extra security but trq is right you should have your validation set in you server code.

 

For the front end validation i would make your life a lot easier and use JQuery.

 

Really simple example that i just tested

 

$(document).ready(function(){
var blocked = ["http://","@",".com"];

$('#myTextBox').blur(function(){
 for(i=0; i < blocked.length; i++) {
  var blockedVal = blocked[i]
  if (this.value.indexOf(blocked[i]) >= 0) {
   alert(blocked[i]);
   $(this).css('border','1px solid red');
  }
 }
})
})

[Adam]

Assuming you're aware of what trq has said and you have server-side validation as well...

 

You have two options. If you're not bothered about older browsers falling back to the server-side validation, you can use the new HTML5 input types "email" and "url" along with the "required" attribute if needed. The browser will handle the validation and highlight any mistakes to the user automagically. This obviously saves you a huge amount of time, but there's no support in older browsers and you can't control the look of it (though you can control the message shown). Still, browser support for it isn't that bad, and is getting better.

 

Or the second option is to build on what you have, though you really need to drop those alert()s and insert elements into the DOM instead. You can detect characters in a String using indexOf(), which returns -1 if no match was made. For URLs you could also check the string starts with "http://", which you can also do with indexOf() returning 0 (meaning at match was made at position 0). The problem with this of course is you have more work to do, cross-browser issues to content with, and the validation isn't all that comprehensive.

 

Personally I would save yourself the headache and let the browser do it, falling back to the server-side validation if needed. Obviously that might not be possible if full cross-browser compatibility is required.