Can I turn a link for example <a href="#">submit</a> into a submit button for a form? If so how? I'm using PHP, MySQL, XHTML and CSS.
-
<a href="javascript:document.forms["myform"].submit();">Tangurena– Tangurena2010年05月01日 18:55:17 +00:00Commented May 1, 2010 at 18:55
6 Answers 6
You can call submit() on your form. Like:
<a href="#" onclick="document.getElementById('myForm').submit();">e</a>
Which is something I really would not recommend, but its the answer to your question.
2 Comments
Not a real one.
You can fake it with JavaScript, but this violates Rule 2.
You can use CSS to make a submit button look like a link, but this isn't generally a good idea (although still a better one than using JS). Users expect buttons to submit forms, and for links to just go somewhere. Violating expectations is poor usability.
Comments
With javascript you can do a onclick
In jquery:
$('theElement').click(function(){
// submit the form...
});
Edited: (I wrote onclick!)
Comments
You can use jQuery for unobtrusive javascript practices and submit the form:
<form id="form_id">
...........
</form>
<a href="#" id="submit_link">submit</a>
jQuery:
$(function(){
$('#submit_link').click(function(){
$('#form_id').submit();
return false;
});
});
Comments
(TESTED ON SAFARI and FF / OSX) I do not have DOS machine at home.
The answer to the question is Yes.
This is how you would code it in plain Javascript:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Form Submit</title>
<script>
window.onload = function(){
document.getElementById("linksubmit").onclick = function(){
if(document.getElementById("foo").value != ''){
document.forms[0].submit();
return false;
}else{
alert('Please fill in Foo');
}
}
}
</script>
</head>
<body>
<form id="theform" action="index.html" method="post">
<label for="foo">Foo</label>
<input type="text" name="foo" id="foo" />
<a href="javascript:void(0);" id="linksubmit">Submit</a>
</form>
</body>
</html>
And this how you would code it with jQuery:
$(document).ready(function(){
$("#linksubmit").click(function(){
if($("#foo").val()!=''){
$("#theform").submit();
return false;
}else{
alert('Please fill in Foo');
}
});
});
Just use this piece between the script tags instead of the first example. Also remember to add the jQuery source code. Google has a hosted version that is good to use: http://code.google.com/apis/ajaxlibs/documentation/index.html#jquery
Comments
<script language="javascript">
function submitform()
{
document.form1.submit();
}
</script>
<form name="form1"></form>
<a href="javascript:submitform()">Submit</a>