So I have a a href
setup as a simple form submit, but I wanted to use it as the same type of method as a submit on a form.
So the way I have it setup is:
<!-- HTML -->
<a onclick="subForm('login');" style="cursor: pointer;"> login </a>
// JavaScript
function subForm(el) {
var elem = document.getElementById(el);
elem.submit();
}
Now when I click on that link it does act as if I have clicked submit on a form, I can set up a input type=hidden
for the form so I can see it in PHP but..
I needed for this login system to not be empty and didn't want to use the older method with if empty
then display an error after processed, so I wanted the submit button to be able to do the same as clicking submit on a form when one of the inputs are set to required
in their markup tag..
Your code should work assuming that that
<a onclick="subForm('login');" style="cursor: pointor;"> login </a>
is inside a form that has an id of 'login';
A couple of things you might want to know is that cursor:pointor is wrong, it should be cursor:pointer. However, if you change your code slightly then you won't need the inline style anyway. Something like this would be a good improvement in my opinion. I've not tested it but it should work:
<form id="login" action="/wherever/you/want/this/form/to/post/to" method="post">
<a id="js-submit-form" href=""> login </a>
</form>
<script>
var formToSubmit = document.getDocumentById('login'),
button = document.getElementById('js-submit-form'),
submitForm = function(e) {
e.preventDefault(); // this will stop the browser trying to use the href value
formToSubmit.submit();
};
button.addEventListener("click",submitForm);
</script>
I've just read the rest of your question but I don't actually understand what you're asking. Why wouldn't you just use the 'required' tag and some server-side validation?
You probably want to make a JavaScript Validation of the form fields.