hi guys,
im building my second website in css and xhtml. now this website requires a login screen for the first page.
i have used javascript for validation, username + password not empty
but if i turn javascript off, whitch i hear alot of people do, it wont work. i want this to be accessible to everyone.
i was wondering what all you developers in css, xhtml, asp, php do about this and what is the best option?
thanx,I do all the work on the server side with PHP and its session functions, but any server-side language could do similar things.<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta name="Content-Script-Type" content="text/javascript">
<meta name="Content-Style-Type" content="text/css">
<title>Example</title>
<script type="text/javascript">
function check (f) {
var e, i = 0;
while (e = f[['user', 'word'][i++]]) {if (!/\S/.test (e.value)) {alert ('Field "' + e.previousSibling.data + '" is required.'); e.focus(); return false}}
}
</script>
<style type="text/css">
form {width:17em}
fieldset {padding:1ex}
label {display:block; text-align:right}
button {display:block; margin:auto}
</style>
</head>
<body>
<form action="log-on.pl" onsubmit="return check (this)">
<fieldset>
<legend>Log on</legend>
<label>User name <input type="text" name="user"></label>
<label>Password <input type="text" name="word"></label>
<button type="submit">Submit</button>
</fieldset>
</form>
</body>
</html>so i should use server side validation and not use javascript? would that be the best option is todays world?Originally posted by Css_Calav
so i should use server side validation and not use javascript? would that be the best option is todays world? Server side requires an annoying extra pair of HTTP requests, client side fails for one in ten users. Best to use both.thanx charles,
what was that first post with all the code ment to be? or what does it do?
if server side fails 1 in 10, what is the ratio for people failing on javascript?Client side, id est:JavaScript, fails for one in ten users. The example above uses JavaScript to validate the form but where there is no JavaScript the form just passes through to the server where you can validate it server side. I suppose, to be fancy, the function "check" could contain the line f.action = "some-other-script.pl" to direct the form to a script that doesn't do any validating. That way it never gets validated twice.awsome! thats sounds like exactly what i want,
so what your saying is, it checks to see if javascript is enabled, and if it is not, it will run a different page with no javascript?
if this is the case, would i be able to use that trick with this code?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>f</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css" media="all">
@import "../survey.css";
</style>
<script language="JavaScript" type="text/JavaScript">
function Login()
{
var errors = false;
if (window.document.login.userid.value == '')
{
alert("Username is a required field.");
window.document.login.userid.focus(); return (false); errors = true;
}
if (window.document.login.password.value == '')
{
alert("Password is a required field.");
window.document.login.password.focus(); return (false); errors = true;
}
if (errors == false)
{
document.login.submit();
}
}
</script>
</head>
<body>
<form name="login" action="open.asp" method="post">
<div id="main_container">
<div id="container">
<img src=http://www.webdeveloper.com/forum/archive/index.php/"../Images/login_logo.gif" height="101" width="150" alt="login_logo" class="login_logo" />
<div id="login">
<p>
<table>
<tr>
<td>Username:</td>
<td><input name="userid" id="userid" type="text" class="inputtext"/></td>
</tr>
<tr>
<td>Password:</td>
<td><input name="password" id="password" type="password" class="inputtext" /></td>
</tr>
<tr>
<td colspan="2" align="right"><input name="login" type="button" value="Login" class="inputbutton" onClick="javascript:Login();"/></td>
</tr>
</table>
</p>
</div>
</div>
</div>
</form>
</body>
</html>Originally posted by Css_Calav
would i be able to use that trick with this code? No. You need to start with a fuly functional, JavaScript free version and then add the JavaScript. As you have noted, yours will not submit whithout JavaScript.
im building my second website in css and xhtml. now this website requires a login screen for the first page.
i have used javascript for validation, username + password not empty
but if i turn javascript off, whitch i hear alot of people do, it wont work. i want this to be accessible to everyone.
i was wondering what all you developers in css, xhtml, asp, php do about this and what is the best option?
thanx,I do all the work on the server side with PHP and its session functions, but any server-side language could do similar things.<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta name="Content-Script-Type" content="text/javascript">
<meta name="Content-Style-Type" content="text/css">
<title>Example</title>
<script type="text/javascript">
function check (f) {
var e, i = 0;
while (e = f[['user', 'word'][i++]]) {if (!/\S/.test (e.value)) {alert ('Field "' + e.previousSibling.data + '" is required.'); e.focus(); return false}}
}
</script>
<style type="text/css">
form {width:17em}
fieldset {padding:1ex}
label {display:block; text-align:right}
button {display:block; margin:auto}
</style>
</head>
<body>
<form action="log-on.pl" onsubmit="return check (this)">
<fieldset>
<legend>Log on</legend>
<label>User name <input type="text" name="user"></label>
<label>Password <input type="text" name="word"></label>
<button type="submit">Submit</button>
</fieldset>
</form>
</body>
</html>so i should use server side validation and not use javascript? would that be the best option is todays world?Originally posted by Css_Calav
so i should use server side validation and not use javascript? would that be the best option is todays world? Server side requires an annoying extra pair of HTTP requests, client side fails for one in ten users. Best to use both.thanx charles,
what was that first post with all the code ment to be? or what does it do?
if server side fails 1 in 10, what is the ratio for people failing on javascript?Client side, id est:JavaScript, fails for one in ten users. The example above uses JavaScript to validate the form but where there is no JavaScript the form just passes through to the server where you can validate it server side. I suppose, to be fancy, the function "check" could contain the line f.action = "some-other-script.pl" to direct the form to a script that doesn't do any validating. That way it never gets validated twice.awsome! thats sounds like exactly what i want,
so what your saying is, it checks to see if javascript is enabled, and if it is not, it will run a different page with no javascript?
if this is the case, would i be able to use that trick with this code?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>f</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css" media="all">
@import "../survey.css";
</style>
<script language="JavaScript" type="text/JavaScript">
function Login()
{
var errors = false;
if (window.document.login.userid.value == '')
{
alert("Username is a required field.");
window.document.login.userid.focus(); return (false); errors = true;
}
if (window.document.login.password.value == '')
{
alert("Password is a required field.");
window.document.login.password.focus(); return (false); errors = true;
}
if (errors == false)
{
document.login.submit();
}
}
</script>
</head>
<body>
<form name="login" action="open.asp" method="post">
<div id="main_container">
<div id="container">
<img src=http://www.webdeveloper.com/forum/archive/index.php/"../Images/login_logo.gif" height="101" width="150" alt="login_logo" class="login_logo" />
<div id="login">
<p>
<table>
<tr>
<td>Username:</td>
<td><input name="userid" id="userid" type="text" class="inputtext"/></td>
</tr>
<tr>
<td>Password:</td>
<td><input name="password" id="password" type="password" class="inputtext" /></td>
</tr>
<tr>
<td colspan="2" align="right"><input name="login" type="button" value="Login" class="inputbutton" onClick="javascript:Login();"/></td>
</tr>
</table>
</p>
</div>
</div>
</div>
</form>
</body>
</html>Originally posted by Css_Calav
would i be able to use that trick with this code? No. You need to start with a fuly functional, JavaScript free version and then add the JavaScript. As you have noted, yours will not submit whithout JavaScript.