PDA

View Full Version : Need help with image gif submit button to call on .js file.


johnnybananas
11-17-2004, 01:12 AM
Hi Gentlemen/Ladies.

I have the following problem I can't seem to solve. I am trying to get an image .gif button on an html page to call on a .js file so guests can proceed forward to other 3 html pages, depending on their inputs. I am working with these 5 files: (1) portal.html (2) accessgranted.js (3) laguest.html (4) ocguest.html (5) sfguest.html ; please see the file codes below.

This is the portal.html file.

<HTML>
<HEAD>
<TITLE>PORTAL: Login id and password</TITLE>
<SCRIPT language="JavaScript" SRC="accessgranted.js"></SCRIPT>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</HEAD>
<BODY bgcolor="#FFFFFF" text="#FFFFFF" link="#999999" alink="#999999" vlink="#666666" marginheight="0" marginwidth="0" topmargin="0" leftmargin="0">
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<center>
<form name=login>
<table width="225" border="0" cellpadding="3" cellspacing="0" bgcolor="#FFFFFF">
<tr>
<td><font color="#990000" size="1" face="Verdana, Arial, Helvetica, sans-serif"><strong>i.d.</strong></font></td>
<td><input type=text name=username></td></tr>
<tr><td><font color="#990000" size="1" face="Verdana, Arial, Helvetica, sans-serif"><strong>password</strong></font></td>
<td><input type=password name=password></td></tr>
<tr><td colspan=2 align=center><input type="image" src="enterbuton.gif" width="147" height="40" border="0" alt="submit button" onClick="Login()"></td></tr>
</table>
</form>
</center>
</BODY>
</HTML>


This is the accessgranted.js file.

<!-- Begin
function Login(){
var done=0;
var username=document.login.username.value;
username=username.toLowerCase();
var password=document.login.password.value;
password=password.toLowerCase();
if (username=="la" && password=="lapass") { window.location="laguest.html"; done=1; }
if (username=="oc" && password=="ocpass") { window.location="ocguest.html"; done=1; }
if (username=="sf" && password=="sfpass") { window.location="sfguest.html"; done=1; }
if (done==0) { alert("Invalid login!"); }
}
// End -->

The other 3 html files just look like this for now.

<HTML>
<HEAD>
<TITLE>WELCOME PAGE</TITLE>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</HEAD>
<BODY bgcolor="#FFFFFF" text="#FFFFFF" link="#999999" alink="#999999" vlink="#666666" marginheight="0" marginwidth="0" topmargin="0" leftmargin="0">
<p>&nbsp;</p>
<p>Welcome to ...</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
</BODY>
</HTML>

I hope all of this makes sense. Thank you all in advance for your help.

chos3n1
11-17-2004, 02:13 AM
What problems are you having with the code? Is it just not calling the function or are you getting unexpected outputs?

johnnybananas
11-17-2004, 05:05 AM
The script is not calling the function, so I'm not being redirected nowhere (i.e. laguest.html, ocguest.html, or sfguest.html). I also tried coding like this:

<a href="javascript:goto('Login()')"><input type="image" src="enterbutton.gif" width="147" height="40" border="0" alt="submit button"></a>

What I'm I doing wrong?

Brandoe85
11-17-2004, 05:12 AM
Are all of the files in the same folder? Your first post seems to be working for me.

johnnybananas
11-17-2004, 05:35 AM
Yes. All of the files are residing in the same server file. Thanks guys for helping me out. I think I am going to go another route forget about using the graphic designed button. I'll keep you posted if I come up with the problem.

Willy Duitt
11-17-2004, 05:52 AM
input type="image" acts the same as input type="submit" and thus is submitting your form... Albeit to itself since there is no form action... Try adding return false to the bottom of your Login function to cancel the form submit so it will follow the location.href....

.....Willy

johnnybananas
11-17-2004, 06:34 AM
Can you show me where to put it?

Brandoe85
11-17-2004, 06:51 AM
This line in the JS file:

if (done==0) { alert("Invalid login!"); return false; }

And when you call the function onclick:

<tr><td colspan=2 align=center><input type="image" src="enterbuton.gif" width="147" height="40" border="0" alt="submit button" onClick="return Login()"></td></tr>