Client Side Filtering - Don't do it!

After perusing Twitter for my daily dose a few people were talking about the following site:

http://www.cadw.wales.gov.uk/

Now at first glance you wouldn't think that anything was wrong with this site.  If you look a little deeper though (think evil hacker), you'd notice the cool little search field on the left side of the page.  These kind of input boxes are generally filtered so as to not allow malicious users to inject anything into back end databases for perform cross-site scripting.  When doesn't this work?  When you put the filtering on the client side in the source code of the page!!!  Viewing the source code of the page you will see the following snippet:


var IllegalChars=new Array("select", "drop", ";", "--", "insert", "delete", "xp_", "update", "/", ":", "char(", "?", "`", "|", "declare", "convert", "cast(", "@@", "varchar", "2D2D", "4040", "00400040", "[", "]");
var IllegalFound=new Array();
var IllegalCharsCount=0;

It doesn't take much to understand what this site is trying to *prevent* from happening here.  What you could do  to bypass is intercept the response to the server and re-include any filtered out web attack you'd like!  Honestly people...if you are going to spend the time implementing security on your webstite; do it right.

Epic Fail...