Share on Google+Share on Google+

jQuery check username availability using JSP

In this section, you will learn to check username availability from database using JSP & jQuery.

jQuery check username availability using JSP

In this section, you will learn to check username availability from database using JSP & jQuery. In the given below example, a username input field is given, when you type username it checks whether it is available means it shouldn't exist in the database. In spite of that, it also checks that the value entered shouldn't be special character. It also restrict from pressing 'space bar' or 'enter' keys.


<title>Registration Form</title>
<style type="text/css">
.style1 {
text-align: left;
.style2 {
text-align: left;
color: #0000FF;
.style3 {
color: #0000FF;
.style4 {
color: #FF0000;
<script type="text/javascript" src="jquery-1.4.2.js"></script>
<script type="text/javascript">
//called when key is pressed in textbox
$("#inputString").keypress(function (e)
//if the letter is not digit then display error and don't type anything
if( e.which!=8 && e.which!=0 && (e.which<48 || e.which>57)
&& (e.which<65 || e.which>90)&& (e.which<97 || e.which>122))
//display error message
$("#error").html("No Special Characters.Only number & alphabets").show();
return false;
function lookup(inputString) {
if(inputString.length <5) {
} else {
$.post("CheckUsername.jsp",{user: ""+inputString+""},function(data){


<h2 class="style2">&nbsp;<strong>Registration Form</strong></h2>
<h4 class="style4">
<h4><span class="style3">Enter desired username :</span>
<input name="Text1"type="text" id="inputString"
style="height: 20px" onkeyup="lookup(this.value);"/>
</h4><font color="red">
<div id="suggestions" style="display: none;">
Value must be greater than 4 characters</div>
<div style="display: none;" id="autoSuggestionsList"></div>
<div style="display: none;" id="error"></div>



If you enter special characters or less than 4 characters ,it will display:

If you enter username which is already available it will display :

Download Source Code


Posted on: August 16, 2010 If you enjoyed this post then why not add us on Google+? Add us to your Circles

Share this Tutorial Follow us on Twitter, or add us on Facebook or Google Plus to keep you updated with the recent trends of Java and other open source platforms.


Advertisement null