This sample demonstrates a simple way to use Jquery Captcha, Validate captcha with matching and Asp.net control validation using JQuery.
(function()
{
var cx = '015363721894368854116:4i6ywnkggls';
var gcse = document.createElement('script');
gcse.type = 'text/javascript';
gcse.async = true;
gcse.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') +
'//www.google.com/cse/cse.js?cx=' + cx;
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(gcse, s);
})();
function DrawCaptcha()
{
var a = Math.ceil(Math.random() * 10) + '';
var b = Math.ceil(Math.random() * 10) + '';
var c = Math.ceil(Math.random() * 10) + '';
var d = Math.ceil(Math.random() * 10) + '';
var e = Math.ceil(Math.random() * 10) + '';
var f = Math.ceil(Math.random() * 10) + '';
var g = Math.ceil(Math.random() * 10) + '';
var code = a + ' ' + b + ' ' + ' ' + c + ' ' + d + ' ' + e + ' ' + f + ' ' + g;
document.getElementById("txtCodeCaptcha").innerHTML = code
}
// Validate the Entered input aganist the generated security code function
function ValidTestimonialCaptcha()
{
var str1 = removeSpaces(document.getElementById('txtCodeCaptcha').innerHTML);
var str2 = removeSpaces(document.getElementById('TestimonialCAPTCHA').value);
if (str1 == str2) return true;
return false;
}
DrawCaptcha();
function removeSpaces(str)
{
return str = str.replace(/\s+/g, '');
}
Validation.js
$(function()
{
$('#reloadCaptcha').click(function()
{
DrawCaptcha();
});
$("#submitTestimonialsBtn").click(function()
{
if ($('#txtTestimonialName').val() == '')
{
$('#txtTestimonialName').prev('.msg').text('Please enter Name.').css('display', 'block');
$('#txtTestimonialName').focus();
return false;
}
else
{
$('#txtTestimonialName').prev('.msg').text('').css('display', 'none');
}
if ($("#txtTestimonialEmail").val() == "")
{
$('#txtTestimonialEmail').prev('.msg').text('Please enter an email.').css('display', 'block');
$('#txtTestimonialEmail').focus();
return false;
}
else
{
$("#txtTestimonialEmail").prev('.msg').text('').css('display', 'none');
}
if ($('#txtTestimonials').val() == "")
{
$('#txtTestimonials').prev('.msg').text('Please enter testimonial.').css('display', 'block');
$('#txtTestimonials').focus();
return false;
}
else
{
$("#txtTestimonials").prev('.msg').text('').css('display', 'none');
}
if ($('#TestimonialCAPTCHA').val() == "")
{
$('#TestimonialCAPTCHA').prev('.msg').text('Please enter valid captcha.').css('display', 'block');
$('#TestimonialCAPTCHA').focus();
return false;
}
else if (!ValidTestimonialCaptcha())
{
$('#TestimonialCAPTCHA').prev('.msg').text('Captcha does not match. Please enter valid captcha').css('display', 'block');
$('#TestimonialCAPTCHA').focus();
return false;
}
else
{
$("#TestimonialCAPTCHA").prev('.msg').text('').css('display', 'none');
}
$(this).submit();
});
});
Captcha Code
{
var cx = '015363721894368854116:4i6ywnkggls';
var gcse = document.createElement('script');
gcse.type = 'text/javascript';
gcse.async = true;
gcse.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') +
'//www.google.com/cse/cse.js?cx=' + cx;
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(gcse, s);
})();
function DrawCaptcha()
{
var a = Math.ceil(Math.random() * 10) + '';
var b = Math.ceil(Math.random() * 10) + '';
var c = Math.ceil(Math.random() * 10) + '';
var d = Math.ceil(Math.random() * 10) + '';
var e = Math.ceil(Math.random() * 10) + '';
var f = Math.ceil(Math.random() * 10) + '';
var g = Math.ceil(Math.random() * 10) + '';
var code = a + ' ' + b + ' ' + ' ' + c + ' ' + d + ' ' + e + ' ' + f + ' ' + g;
document.getElementById("txtCodeCaptcha").innerHTML = code
}
// Validate the Entered input aganist the generated security code function
function ValidTestimonialCaptcha()
{
var str1 = removeSpaces(document.getElementById('txtCodeCaptcha').innerHTML);
var str2 = removeSpaces(document.getElementById('TestimonialCAPTCHA').value);
if (str1 == str2) return true;
return false;
}
DrawCaptcha();
function removeSpaces(str)
{
return str = str.replace(/\s+/g, '');
}
Validation.js
$(function()
{
$('#reloadCaptcha').click(function()
{
DrawCaptcha();
});
$("#submitTestimonialsBtn").click(function()
{
if ($('#txtTestimonialName').val() == '')
{
$('#txtTestimonialName').prev('.msg').text('Please enter Name.').css('display', 'block');
$('#txtTestimonialName').focus();
return false;
}
else
{
$('#txtTestimonialName').prev('.msg').text('').css('display', 'none');
}
if ($("#txtTestimonialEmail").val() == "")
{
$('#txtTestimonialEmail').prev('.msg').text('Please enter an email.').css('display', 'block');
$('#txtTestimonialEmail').focus();
return false;
}
else
{
$("#txtTestimonialEmail").prev('.msg').text('').css('display', 'none');
}
if ($('#txtTestimonials').val() == "")
{
$('#txtTestimonials').prev('.msg').text('Please enter testimonial.').css('display', 'block');
$('#txtTestimonials').focus();
return false;
}
else
{
$("#txtTestimonials").prev('.msg').text('').css('display', 'none');
}
if ($('#TestimonialCAPTCHA').val() == "")
{
$('#TestimonialCAPTCHA').prev('.msg').text('Please enter valid captcha.').css('display', 'block');
$('#TestimonialCAPTCHA').focus();
return false;
}
else if (!ValidTestimonialCaptcha())
{
$('#TestimonialCAPTCHA').prev('.msg').text('Captcha does not match. Please enter valid captcha').css('display', 'block');
$('#TestimonialCAPTCHA').focus();
return false;
}
else
{
$("#TestimonialCAPTCHA").prev('.msg').text('').css('display', 'none');
}
$(this).submit();
});
});
No comments:
Post a Comment