Developers Tutorials in ASP, PHP, ASP.NET, JSP, Python AND Ruby
 
Classic ASP ASP.NET PHP/mySQL JSP/Servlet Ajax Ruby Python Cold Fusion Perl
  Home |   Topics |   Search |   Login / Register |   Rss Feeds


Topics
» Classic ASP
» ASP.NET
» PHP/mySQL
» JSP/Servlet
» Ajax
» Ruby
» Python
» Cold Fusion
» Perl
Search news
Search for:

My Account
Email:

Password:


Register
Forgot password?

Listed in ASPin.com




site statistics



Ajax powered ASP user signup form



This sample application lets your clients to check username before contiue to fill the  sign up form. Rest of the code is a simple user signup form and stores the information to SQL Server.

Let's examine all code:

usernamecheck.js

var xmlHttp

function checkUsername(str)
{
xmlHttp=GetXmlHttpObject();
if (xmlHttp==null)
  {
  alert ("Your browser does not support AJAX!");
  return;
  }
    var url="check.asp";
    url=url+"?username="+str;
    xmlHttp.onreadystatechange=stateChanged;
    xmlHttp.open("GET",url,true);
    xmlHttp.send(null);
}

function stateChanged()
{
if (xmlHttp.readyState==4)
{
document.getElementById("userNameControlValue").innerHTML=xmlHttp.responseText;
}
}
function GetXmlHttpObject()
{
var xmlHttp=null;
try
  {
  // Firefox, Opera 8.0+, Safari
  xmlHttp=new XMLHttpRequest();
  }
catch (e)
  {
  // Internet Explorer
  try
    {
    xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
    }
  catch (e)
    {
    xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
  }
return xmlHttp;
}

If you look at signup form page, you'll see that I have entered a simple ajax code. When a client hit "Check Availability" button, script send username input value to checkUsername function. Our Ajax/JavaScript codes are stored in usernamecheck.js file. And send value to check.asp file and retrieves the result. stateChanged function passes returned message form check.asp to our sign up form.
All we do with Ajax is send to check.asp file user input value and write message inside userNameControlValue div tag.


<%
    if request.form("formsubmit") = "true" then
    set cn= server.CreateObject("adodb.connection")
    cn.open "Provider=SQLOLEDB;Data Source=.\SQLEXPRESS;database=gnews2;uid=sa;pwd=123456;"

    uname = replace(trim(Request.QueryString("username")), "'", "''")
    password = replace(trim(Request.QueryString("password")), "'", "''")
    password1 = replace(trim(Request.QueryString("password1")), "'", "''")
    Dim strMsg
    Dim errs
    errs = 0
    if len(uname) < 6 then
        errs = errs + 1
        strMsg = strMsg & "The username must contain at least six characters.<br/>"
    elseif len(uname) > 25 then
        errs = errs + 1
        strMsg = strMsg & "The username must contain at most twentyfive characters.<br/>"
    end if

    if len(password) < 6 then
        errs = errs + 1
        strMsg = strMsg & "The password must contain at least six characters.<br/>"
    elseif len(password) > 10 then
        errs = errs + 1
        strMsg = strMsg & "The password must contain at most ten characters.<br/>"
    end if
    if errs = 0 then
    set r = cn.execute("select uname from  users where uname like '"& uname &"'")
    if not r.eof then
        errs = errs + 1
        strMsg = strMsg & "<i>"& uname &"</i> is not available. Please try a different username.<br/>"    
    end if    
    end if
    if errs = 0 then
        cn.execute("insert into user (uname, pword) values ('"& uname &"', '"& password &"');")
        strMsg = "Your account created!<br/>"
        
        ' here you can create sessions and redirect user to user pages.
       
    end if

    end if
%>
<html>
<head>
    <title>User Sign Up Form</title>
    <script type="text/javascript" src="usernamecheck.js"></script>
    <style type="text/css">
        td, input { font:11px arial; }
    </style>
   
</head>
<body>
    <form action="signup.asp" method="post">

    <input type="hidden" name="formsubmit" value="true"/>
    <center>
    <table border="0">
    <tr>
    <td></td>   
    <td>
    <%
        response.write strMsg
    %>   
    <div id="userNameControlValue"><b></b></div>
    </tr>
    </tr>
    <tr>
    <td>Username:</td>   
    <td>
    <input type="text" name="username" size="30"/>
    <input type="button" name="func" value="Check Availability" onclick="checkUsername(username.value);"/>
    </td>
    </tr>
    <tr>
    <td >Password:</td>   
    <td>
    <input type="password" name="password" size="15"/>
    </td>
    </tr>
    <tr>
    <td>Password (retype):</td>   
    <td>
    <input type="password" name="password1" size="15"/>
    </td>
    </tr>
    <tr>
    <td></td>   
    <td><input type="submit" name="func" value="Sign Up"/></td>
    </tr>
    </table>
    </center>
</form>
</body>
</html>

Check.asp file is a simple ASP code and checks username input value. SQL query searches database and returns username is available or not.

<%
        username = replace(trim(Request.QueryString("username")), "'", "''")
        if len(username) > 0 then
        set cn= server.CreateObject("adodb.connection")
        cn.open "Provider=SQLOLEDB;Data Source=GZ\SQLEXPRESS;database=gnews2;uid=sa;pwd=123456;"
        sql = "select uname from  users where uname like '"& username &"'"
        set r = cn.execute(sql)
        if r.eof then
            response.write "<br/><font color=""#006600"">Username <i>"& username &"</i> is available.</font>"
        else
            response.write "<br/><font color=""#fe0002"">Username <i>"& username &"</i> is not available. Please try a different username</font>"   
        end if
        r.close
        set r = nothing
        cn.close
        set cn = nothing
        else
        response.write "<br/><font color=""#fe0002"">Please type your username.</font>"
        end if
%>




You may edit all source simply and can be used in a real application. ASP is enough suitable to work with Ajax.

Download all code.

Happy Coding





More latest headlines in Ajax
This sample application lets your clients to check username before contiue to fill the  sign up form. Rest of the code is a simple user signup form and stores the information to SQL Server.







What's New
Display Paged Recordset Data
GetRows VBScript Class - Part III: Paging the results
ASP & MySQL Record Paging
Ways to get Alphabetical Paging for your ASP scripts
Sorting Database Records
Recordset Paging Script
Paging through Records using a Stored Procedure
Paged Table Displays by Charles Carroll & Jeff Emrich
Recordset Paging with ADO 2.0
Fill A ComboBox with DB Information

Most Popular
Retrieving Column Names with values
Cross-Page Posting Example
GetRows VBScript Class - Part III: Paging the results
Sorting Database Records
How to modify expire date of a cookie
ASP & MySQL Record Paging
Custom Client Side Drag and Drop Behavior in ASP.NET AJAX
Mark a GridView row, and move it with the up and down key
Ways to get Alphabetical Paging for your ASP scripts
Clustering Macromedia's Enterprise Application Servers with Alteon's ACEdirector Switch

Copyright © 2008 Powered by GNews Publisher Positive. All rights reserved. Contact Us - Load Time: 0.11 second(s)