I've finally worked out how to get my image replacement AND my form
validation working. Here is my form (more or less):
<form action="index.php" method="post" name="frmLogin"
id="frmLogin">
<fieldset>
<legend> Sign in </legend>
<p><span class='asterisk'>*</span>
required fields </p>
<label for="username" class="followon" >Username<span
class='asterisk'>*</span></label>
<br />
<input name="username" id="username"
type="text" size="20" tabindex="1" />
<br />
<label for="passwd" class="followon" >Password<span
class='asterisk'>*</span></label>
<br />
<input name="passwd" id="passwd"
type="password" class="followon" size="20" tabindex="2" />
<br />
<label for="remember">Remember me</label>
<input type="checkbox" name="remember" name="remember"
class="checkbox" value="yes" tabindex="3" />
<br /><br />
<div id="submit-container">
<input type="image" name="submit" id="pretty-button"
value="Sign in" src="images/sign-in.gif" tabindex="4" />
</div>
</fieldset>
</form>
Here is the css:
.img_button {
cursor: pointer;
}
Here is the javascript:
function submitLoginForm() {
if ($("#username").val()=="" ) {
alert ("Please complete the username fields.");
return false;
} else if ($("#passwd").val()=="" ) {
alert ("Please complete the password field.");
return false;
} else {
$('#frmLogin')[0].submit();
}
}
function loadLoginForm() {
$("#submit-container").empty().append('<a id="submit"><img
src="images/sign-in.png" alt="Sign in" border="0" width="67" height="20"
tabindex="4" class"img_button" id="pretty-button" /></a>');
$("#js").val("1");
$("#submit").keydown( function() {
submitLoginForm();
return false;
}).click(function(){
submitLoginForm();
return false;
});
}
The trick is to wrap the replacement image in an empty link (<a
id="submit">.. ). Once inside this the form submission through javascript
works.
--
View this message in context:
http://www.nabble.com/Form-not-submitting-tf3025179.html#a8421502
Sent from the JQuery mailing list archive at Nabble.com.
_______________________________________________
jQuery mailing list
[email protected]
http://jquery.com/discuss/
