Login form: enable disabled login button when username/password have values

I have to come up with a user authenication page the logs the user in and also gives them access to do the right things. without using server side scripting. Just javacript and access. I have attached the code and the access file and have got started on a few things.
I first need to create a login page with the fields username and password have that check the access database and then proceed it to a page to do the following depending on the user access. For The Login button to even be enabled the username and password must have a value in it; I have no idea how to do that

Add A User [No duplicate Users]
Modify A User
- Admin can change anyone
- Power User can change only themselves
and everyone else except admin
- regular user can only change themselves
Delete A User
-Admin can delete anyone
Password Length [9-20 Characters]
Display The current person logged in person's info
Display all users

Groups:
Administrative - Has the ability to change everything
Power - Can change/modify everyone's informantion EXCEPT administrative group people
Regular - Can modify themselves only.

Only administrator and power user should be able to add a user

Only admin can delete users

Again it's supposed to connect with Access database and need to use javascript. I attached the file and code.Access 2007 File Thanks =).

HTML Page

Expand|Select|Wrap|Line Numbers

 <html>

<head>

    <title>JavaScript Example 2</title>

    <script type="text/javascript" src="JScriptDB.js">
 
    </script>

</head>

<body>
 
<form name="student" method="get" action="" onSubmit="return false;">
 
<p>Enter student's first name: <input type="text" name="studentfn" /><br />

  Enter student's last name: <input type="text" name="studentln" /><br />

  Enter student's ID: <input type="text" name="studentid" /><br />

  User Name:  <input type="text" name="usr1" id="usr1" /><br/>

Password*: <input type="password" name="pswd1" id="pswd1" /><br /> 

Date Of Birhth:  <input type="text" name="dob1" id="dob1" /><br/>

 </p>

<p>

  <input type="button" id="Display" onClick="Display()" value="Display All Records" />

    <input type="button" id="Update" onClick="updateStudent()" value="Update Student" />

      <input type="button" id="Delete" onClick="deleteStudent()" value="Delete Record" />

        <input type="button" id="Insert" onClick="insertStudent()" value="Insert Record" />

          <input type="button" id="Display" onClick="DisplayUser()" value="Display User Record" />

</p>
 
</form>
 
</body>

</html>

Javascript

Expand|Select|Wrap|Line Numbers

 //declare variables
 
var adOpenDynamic =2;

var adLockOptimistic =3;

var strDB_Path = "C:\Temp\\cst2309.accdb"; //MS access db path

var conn_str = "Provider=Microsoft.ACE.OLEDB.12.0;Data Source=" + strDB_Path; // MS 2007 Provider String
 
var conn_str11 = "Provider=Microsoft.Jet.OLEDB.4.0;Data Source=" + strDB_Path; // MS 2003 Provider String
 
function AdoDB(strADO)

{

    if(window.ActiveXObject)

    {

        return new ActiveXObject(strADO);

    }

    else

    {

        return ActiveXObject(strADO);

    }

}
 
function DisplayUser()

{

    var conn = AdoDB("ADODB.Connection");

    var strSQL = "Select * from Student where usr ='"+ usr1 + "' and pswd = '"+ pswd1 +"'";
 
    conn.open(conn_str,"",""); //open my db connection
 
    // declare my dataset

    var dsStudent = new ActiveXObject("ADODB.Recordset");
 
    dsStudent.open(strSQL, conn, adOpenDynamic, adLockOptimistic);
 
    var strHTML ="";

    strHTML ="<table cellpadding=0 cellspacing=0 border=1 width='100%' align=center>";

    strHTML +="<tr><td align=center colspan=4><b>Student Records</b></td></tr>";
 
    if(!dsStudent.bof)

    {

        dsStudent.MoveFirst();

        while(!dsStudent.eof)

        {

            strHTML += "<tr>";

            strHTML += "<td><Font face='tahoma'>" + dsStudent.fields(0) +"</font></td>";

            strHTML += "<td><Font face='tahoma'>" + dsStudent.fields(1) +"</font></td>";

            strHTML += "<td><Font face='tahoma'>" + dsStudent.fields(2) +"</font></td>";

            strHTML += "<td><Font face='tahoma'>" + dsStudent.fields(3) +"</font></td>";

            strHTML += "<td><Font face='tahoma'>" + dsStudent.fields(4) +"</font></td>";

            strHTML += "<td><Font face='tahoma'>" + dsStudent.fields(5) +"</font></td>";

            strHTML += "<td><Font face='tahoma'>" + dsStudent.fields(6) +"</font></td>";

            strHTML += "</tr>";

            dsStudent.MoveNext();

        }//close while

    }// close if statement

    else

    {

        strHTML += "<tr colspan=4><td align=center><font color=red>No Records :(</font></td></tr>";

    }//close else

    strHTML = "</table>";

    document.write(strHTML);

}// close Display
 
function Display()

{

    var conn = AdoDB("ADODB.Connection");

    var strSQL = "Select * from Student";
 
    conn.open(conn_str,"",""); //open my db connection
 
    // declare my dataset

    var dsStudent = new ActiveXObject("ADODB.Recordset");
 
    dsStudent.open(strSQL, conn, adOpenDynamic, adLockOptimistic);
 
    var strHTML ="";

    strHTML ="<table cellpadding=0 cellspacing=0 border=1 width='100%' align=center>";

    strHTML +="<tr><td align=center colspan=4><b>Student Records</b></td></tr>";
 
    if(!dsStudent.bof)

    {

        dsStudent.MoveFirst();

        while(!dsStudent.eof)

        {

            strHTML += "<tr>";

            strHTML += "<td><Font face='tahoma'>" + dsStudent.fields(0) +"</font></td>";

            strHTML += "<td><Font face='tahoma'>" + dsStudent.fields(1) +"</font></td>";

            strHTML += "<td><Font face='tahoma'>" + dsStudent.fields(2) +"</font></td>";

            strHTML += "<td><Font face='tahoma'>" + dsStudent.fields(3) +"</font></td>";

            strHTML += "<td><Font face='tahoma'>" + dsStudent.fields(4) +"</font></td>";

            strHTML += "<td><Font face='tahoma'>" + dsStudent.fields(5) +"</font></td>";

            strHTML += "<td><Font face='tahoma'>" + dsStudent.fields(6) +"</font></td>";

            strHTML += "</tr>";

            dsStudent.MoveNext();

        }//close while

    }// close if statement

    else

    {

        strHTML += "<tr colspan=4><td align=center><font color=red>No Records :(</font></td></tr>";

    }//close else

    strHTML = "</table>";

    document.write(strHTML);

}// close Display
 
function updateStudent() {

    var fn = document.getElementById("studentfn").value;

    var ln = document.getElementById("studentln").value;

    var studid = document.getElementById("studentid").value;
 
    var strSQL = "update Student set fname = '" + fn + "' ,lname ='" + ln + "' where studentid =" + studid;

    alert("SQL statement: " + strSQL);
 
    var conn = AdoDB("ADODB.Connection");
 
    conn.open(conn_str,"",""); //open my db connection
 
    // declare my dataset

    var dsStudent = new ActiveXObject("ADODB.Recordset");
 
    dsStudent.open(strSQL, conn, adOpenDynamic, adLockOptimistic);
 
    alert("updated completed");

}// close updateStudent
 
function deleteStudent()

{

//    var fn = document.getElementById("studentfn").value;

//    var ln = document.getElementById("studentln").value;

    var studid = document.getElementById("studentid").value;
 
    var strSQL = "delete Student where studentid =" + studid;

    alert("SQL statement: " + strSQL);
 
    var conn = AdoDB("ADODB.Connection");
 
    conn.open(conn_str, "", ""); //open my db connection
 
    // declare my dataset

    var dsStudent = new ActiveXObject("ADODB.Recordset");
 
    dsStudent.open(strSQL, conn, adOpenDynamic, adLockOptimistic);
 
    alert("deleted completed");
 
}// close deleteStudent
 
function insertStudent()

{

    var fn = document.getElementById("studentfn").value;

    var ln = document.getElementById("studentln").value;

    var studid = document.getElementById("studentid").value;

    var dobv = document.getElementById("dob1").value;
 
    var strSQL = "insert into Student(fname, lname,dob) values('" + fn + "','" + ln + "','" + dobv +"')";

    alert("SQL statement: " + strSQL);
 
    var conn = AdoDB("ADODB.Connection");
 
    conn.open(conn_str, "", ""); //open my db connection
 
    // declare my dataset

    var dsStudent = new ActiveXObject("ADODB.Recordset");
 
    dsStudent.open(strSQL, conn, adOpenDynamic, adLockOptimistic);
 
    alert("insert completed");

}// close insertStudent
 
function LoginPerson()

{
 
var conn = AdoDB("ADODB.Connection");

var strSQL = "Select * from Student where usr ='"+ usr1 + "' and pswd = '"+ pswd1 +"'";
 
    conn.open(conn_str,"",""); //open my db connection
 
    // declare my dataset

    var dsStudent = new ActiveXObject("ADODB.Recordset");
 
    dsStudent.open(strSQL, conn, adOpenDynamic, adLockOptimistic);
 
    alert("Logging In");
 
 var strHTML ="";

    strHTML ="<table cellpadding=0 cellspacing=0 border=1 width='100%' align=center>";

    strHTML +="<tr><td align=center colspan=4><b>Student Records</b></td></tr>";
 
    if(!dsStudent.bof)

    {

        dsStudent.MoveFirst();

        while(!dsStudent.eof)

        {

            strHTML += "<tr>";

            strHTML += "<td><Font face='tahoma'>" + dsStudent.fields(0) +"</font></td>";

            strHTML += "<td><Font face='tahoma'>" + dsStudent.fields(1) +"</font></td>";

            strHTML += "<td><Font face='tahoma'>" + dsStudent.fields(2) +"</font></td>";

            strHTML += "<td><Font face='tahoma'>" + dsStudent.fields(3) +"</font></td>";

            strHTML += "<td><Font face='tahoma'>" + dsStudent.fields(4) +"</font></td>";

            strHTML += "<td><Font face='tahoma'>" + dsStudent.fields(5) +"</font></td>";

            strHTML += "<td><Font face='tahoma'>" + dsStudent.fields(6) +"</font></td>";

            strHTML += "</tr>";

            dsStudent.MoveNext();

        }//close while

    }// close if statement

    else

    {

        strHTML += "<tr colspan=4><td align=center><font color=red>No Records :(</font></td></tr>";

    }//close else

    strHTML = "</table>";

    document.write(strHTML);

}// close Login

Dec 5 '10 #1

Subscribe Post Reply

4122

acoder

16,027

Expert Mod 8TB

Keep your login button disabled:

Expand|Select|Wrap|Line Numbers

<input type="button" ... disabled="disabled">

Then you need some event to trigger the change. One event is the onchange event on the username and password text boxes, e.g.

Expand|Select|Wrap|Line Numbers

<input type="text" name="username" ... onchange="enableButton()">

where the function would enable the button if both the text boxes had values in them. To enable a button, set the disabled property to false:

Expand|Select|Wrap|Line Numbers

btn.disabled = false;

Dec 21 '10 #2

Bharat383

Expand|Select|Wrap|Line Numbers

 <html xmlns="http://www.w3.org/1999/xhtml">

<head>

<title>Login form </title>

<script type="text/javascript">

    function display_submit()

    {

            if((document.getElementById("uname").value != "") && (document.getElementById("pwd").value != ""))

            {

                document.getElementById("submit_button").disabled = false;

            }

            else

            {

                document.getElementById("submit_button").disabled = true;

            }

    }

</script>

</head>

<body>

<form name="form1">

    <table width="300" cellspacing="10">

        <tr>

                <th>Username</th>

                <td>

                        <input type="text" name="uname" value="" id="uname" onblur="display_submit()"/>

                </td>

        </tr>

        <tr>

                <th>Password</th>

                <td>

                    <input type="password" name="password" value="" id="pwd"  onblur="display_submit()"/>

                </td>

        </tr>

        <tr>

                <td colspan="2" align="center">

                        <input type="submit" name="submit_button" id="submit_button" value="LOG IN" disabled="disabled"/>

                </td>

        </tr>

    </table>

</form>

</body>

</html>

May 17 '12 #3

acoder

16,027

Expert Mod 8TB

onchange (triggered on a change) makes more sense that onblur.

May 23 '12 #4

by: John Wolrehammer | last post by:

After the user login in i want to close the login form. I can close it but it also closes the whole application. Can anyone help.

.NET Framework

by: JPSutor | last post by:

I have a login form, that if successfully answered, launches another form. The problem is that the login form remains even after I show the main form. How do I get rid of the login form?

C# / C Sharp

Forms Authentication - Pass String to Login Form

by: David Krussow | last post by:

Just wondering if/how it would be possible to display a variable string on the login form - where the string varies depending on the form the user attempted to access. To clarify, an...

ASP.NET

by: Agnes | last post by:

My login form will call a main form with menu in my button_OK click event >dim frmMain as new mainform >frmMain.show() >Me.dispose() The login form didn't close by itself, Please help.. Thanks

Visual Basic .NET

Showing form , closing login form but not closing app, how

by: Bob | last post by:

I haver a user login form (winforms app using vs2005 in VB.NET). After succesfull validayion of user I want to open a first form and close the loging form that was used, If I write If...

Visual Basic .NET

Basic question about login form and passing success back to main form

by: Ronald S. Cook | last post by:

It's been longer that I remember since writing windows (not web) apps. 1) I want to load a main form 2) User clicks login button which brings up login form (on top of main form) 3) Upon...

C# / C Sharp

dispose the login form

by: jt | last post by:

The program i have has login form. After a user has loged in, formX is loaded and i want to dispose all the forms that where used before (login form). so the result should be the same as when...

Visual Basic .NET

using onLoad() to focus login form- error handling

by: knot2afrayed | last post by:

I am trying to fix error- object does not exist- I want it possible to allow object not to exist. I am writing a script on a page that may or may not include a login form. For example-after a...

Javascript

by: Rinoa | last post by:

I'm developing a program with a login form. I want the login in form to be the first form that loads, and I want it to close itself when the main CP loads. However, when I set frmLogIn as the startup...

Visual Basic 4 / 5 / 6

I had created a login form in jsp..... the code is as shown below ....

by: naharol | last post by:

<%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%> <%@page import="java.sql.*"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01...

Java

Easy Steps to Fix "Canon Printer Won't Connect to WiFi Network"

by: taylorcarr | last post by:

A Canon printer is a smart device known for being advanced, efficient, and reliable. It is designed for home, office, and hybrid workspace use and can also be used for a variety of purposes. However,...

General

How to turn on java script in a villaon keypad mobile phone

by: Charles Arthur | last post by:

How do i turn on java script on a villaon, callus and itel keypad mobile phone

Java

Basic Javascript concepts

by: aa123db | last post by:

Variable and constants Use var or let for variables and const fror constants. Var foo ='bar'; Let foo ='bar';const baz ='bar'; Functions function $name$ ($parameters$) { } ...

Javascript

Batch import of multiple excel files into the database

by: ryjfgjl | last post by:

If we have dozens or hundreds of excel to import into the database, if we use the excel import function provided by database editors such as navicat, it will be extremely tedious and time-consuming...

Data Management

Migrating Website to Cloud - Emmanuel Katto

by: emmanuelkatto | last post by:

Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud. Please let me know. Thanks! Emmanuel

General

Navigating the Data Structures and Algorithms (DSA)

by: BarryA | last post by:

What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...

Algorithms / Advanced Math

Is that possible of reading the .csv file in column wise and the column have different lengths ?

by: Sonnysonu | last post by:

This is the data of csv file 1 2 3 1 2 3 1 2 3 1 2 3 2 3 2 3 3 the lengths should be different i have to store the data by column-wise with in the specific length. suppose the i have to...

C / C++

What is ONU?

by: marktang | last post by:

ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...

General

Problem With Comparison Operator <=> in G++

by: Oralloy | last post by:

Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...

C / C++

Login form: enable disabled login button when username/password have values

Similar topics