[newbie] Anti-SPAM + form validator?

Dev Shed Forums Sponsor:

November 29th, 2012, 09:22 AM

littlebigman

Registered User

Join Date: May 2010

Posts: 28

Time spent in forums: 4 h 41 m 2 sec
Reputation Power: 0

jQuery - [newbie] Anti-SPAM + form validator?

Hello

This must be a very simple problem for JS experts, but I don't know enough yet about JS to know how to solve it.

After successfully adding and using jQuery's form validator, I'd like to add a simple "Please computer a+b" anti-SPAM check.

The problem is how to combine the two?

Here's a simplified example:

Code:

<head>
	<script src="http://code.jquery.com/jquery.min.js"></script>
	<script type="text/javascript" src="js/jquery.validate.js"></script>
	
	<script type="text/javascript">
		//========= jQuery form validator
		jQuery.extend(jQuery.validator.messages, {
		    required: "This field is required.",
		    email: "Please enter a valid e-mail address."
		});

		//========= Simple, anti-spam scheme  
		var a = Math.ceil(Math.random() * 10);
		var b = Math.ceil(Math.random() * 10);       
		var c = a + b
		
		function DrawBotBoot()
		{
		    document.write("Compute "+ a + " + " + b +"? ");
		    document.write("<input id='BotBootInput' type='text' maxlength='2' size='2'/>");
		}    
		function ValidBotBoot(){
		    var d = document.getElementById('BotBootInput').value;
		    if (d == c) return true;
		    return false;
		}
		
		//========= ?How to check anti-spam answer + validate other fields in form?
		$(document).ready(function(){
		  $("#myform").validate({
		  	/*submitHandler: function(form) {
		       form.submit();
				}
			});*/
		};
  </script>
</head>

<body>

<form action="send.php" method="post" id="myform">
	Name <input type="text" maxlength="25" id="name" name="name" class="required"/>
	Anti-SPAM check<script type="text/javascript">DrawBotBoot()</script>

	<input type="submit" class="submit" value="Send" onclick="alert(ValidBotBoot());"/>
</form>

</body>

Thanks for any help.

November 29th, 2012, 07:44 PM

web_loone08

Contributing User

Join Date: Aug 2008

Posts: 599

Time spent in forums: 1 Week 1 Day 12 h 40 m
Reputation Power: 69

Although this is very easily beaten by a bot; because a math captcha; would not be that hard to crack, for a bot and using a JavaScript Captcha; could cut down on end user accessibility... here is a basic example of what your wanting.

Code:

<head>
	
<script src="http://code.jquery.com/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.validate.js"></script>

	<script type="text/javascript">

		var submit="no";

		//========= jQuery form validator
		jQuery.extend(jQuery.validator.messages, {
		    required: "This field is required.",
		    email: "Please enter a valid e-mail address."
		});

		// Simple, anti-spam scheme  
		var a = Math.ceil(Math.random() * 10);
		var b = Math.ceil(Math.random() * 10);       
		var c = " " + a + " + " + b;
                
                function botbuster()
		{
		var bot_answer_field = " <input id='BotBootInput' type='text' maxlength='2' size='2'/>";
		document.getElementById("botty").innerHTML = c + bot_answer_field;
		}

		function ValidBotBoot(){
		    var d = parseInt(document.getElementById('BotBootInput').value);
			c = eval(c);
			  if (d == c) {
				submit="yes";
			    }
			else if (d != c) {
				alert("Invalid Captch - Please Try Again");
				submit="no";
			 }
			}
		
		$(document).ready(function(){
			new botbuster();
		  $("#myform").validate({
		  	submitHandler: function(form) {
					if (submit=="yes") {
				       		form.submit();
					}
				}
			});
		});

  </script>

</head>

<body>

<form action="send.php" method="post" id="myform">
	Name <input type="text" maxlength="25" id="name" name="name" class="required"/>
	Anti-SPAM check<span id="botty"></span>

	<input type="submit" class="submit" value="Send" onclick="ValidBotBoot()"/>
</form>

</body>

jQuery - [newbie] Anti-SPAM + form validator?

Developer Shed Advertisers and Affiliates