Click to See Complete Forum and Search --> : Urgent help needed.


ProperBo
10-26-2003, 04:06 AM
lo all

i'm a VBscripter, use ASP a lot and am trying to make an advanced login system for a client.

Trouble is, I need to catch data from a button and pass it to a textfield on the same page without submitting the form or overwriting the textbox whenever a second button is pressed.

bought myself the javascript bible and got a few hints but nothing that really pointed me to where i need to go.

SCENARIO:

Login page will be a numbered keypad, instead of usual login/password fields. using 10 buttons with values of 0-9 for the numbers input.

Upon onClick() of the button i need the corresponding number to enter itself into the textfield below it. ( sort of like a calculator, but without the sums )

so they enter a 6 digit code, and THEN i can submit it to the server for entry into the DB or whatever.

if someone could explain this to me in a noobish way, i'd be eternally grateful.

Charles
10-26-2003, 06:19 AM
Because these buttons will do nothing for the 13% of users who do not use JavaScript you will want to draw them with JavaScript.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta name="Content-Script-Type" content="text/javascript">
<title>Example</title>

<style type="text/css">
<!--
label {display:block}
input {display:block}
button {margin:1ex}
button.key {width:2em}
-->
</style>

<form action="">
<div>
<label>Password<input type="text" id="password"></label>
<script type="text/javascript">
<!--
document.getElementById('password').disabled = true;
document.write('<div>')
document.write('<button class="key" onclick="this.form.password.value += this.value">7</button>')
document.write('<button class="key" onclick="this.form.password.value += this.value">8</button>')
document.write('<button class="key" onclick="this.form.password.value += this.value">9</button>')
document.write('</div>')
document.write('<div>')
document.write('<button class="key" onclick="this.form.password.value += this.value">4</button>')
document.write('<button class="key" onclick="this.form.password.value += this.value">5</button>')
document.write('<button class="key" onclick="this.form.password.value += this.value">6</button>')
document.write('</div>')
document.write('<div>')
document.write('<button class="key" onclick="this.form.password.value += this.value">1</button>')
document.write('<button class="key" onclick="this.form.password.value += this.value">2</button>')
document.write('<button class="key" onclick="this.form.password.value += this.value">3</button>')
document.write('</div>')
document.write('<div>')
document.write('<button class="key" onclick="this.form.password.value += this.value" style="margin-left:6.5ex">0</button>')
document.write('</div>')
// -->
</script>
<button type="submit">Log on</button>
<button type="reset">Clear</button>
</div>
</form>

Vladdy
10-26-2003, 06:19 AM
So what happens if a user have javascript disabled? They would not be able to log in at all?
Also just curious what is so advanced about this log in? Does it provide higher security or more convenince?


<button onclick="document.getElementById('pwd').value+='1'">1</button>
......
<input type="password" id="pwd" value="" />

ProperBo
10-26-2003, 07:35 AM
thx a million charles.

after fruitless searches, i finally found some basic calculator code, that showed me how to pass the data.

but little did i know about the non-jscript users.
thx for the script, just looking at it, i can see the logic, and wonder how far i can now push this stuff myself.

Vladdy, when i say advanced, it's for the big picture, im gonna animate it all up for a gaming site, and have the login system simulate a bank vault, more advanced graphics than, advanced scripting, but it caught your eyes and i got the answer i so desperately needed.

as for those that don't use .js it don't really matter as we only have around 20 admins for the servers, and we all use javascript. but a good question.

Thanks very much :)

Charles
10-26-2003, 08:08 AM
Originally posted by ProperBo
as for those that don't use .js it don't really matter as we only have around 20 admins for the servers, and we all use javascript. but a good question. If you are located in the United States then TItle III of the Americans with Disabilities Act (http://www.usdoj.gov/crt/ada/pubs/ada.txt) requires you to make reasonable accomodations for employees with disabilities. It's far better to have everything up to the accessibility standards (http://www.w3.org/TR/WCAG10/) now then to quickly retrofit when the first blind adminiastrator is hired. And don't get caught refusing to hire a blind administrator simply because your system isn't accessible.