views:

115

answers:

3

I'm currently working on a site where I use anchors to submit forms with jQuery like this:

$("a[title=submit]").click( function(){
      $(this).parents("form").submit();
      });
});

However I've read that using links this way is bad practice, security-wise.

Does anybody know what the issues are?

+4  A: 

This is no security issue because everyone can manipulate the html/js/css code on his local machine by using Firebug or other tools. Please keep in Mind that your forms should ALWAYS be validated by the server (backend).

Tim
I wouldn't say there is NO security issue, but I agree it is NOT less secure than with traditional form submit.
o.k.w
+1  A: 

There is no security issue but it may not work for all users.

Javascript could be turned off (in which case you could not submit at all), or security plugins might block the script if it mistakenly detects post-by-javascript as a malicious script.

You should ensure the page is still useable if javascript is switched off. Perhaps render a submit button in the html, and then use jQuery to remove the button and insert an anchor. This way if javascript is working, you'll get your anchor-submission, but if it is not, you'll still get your submit button

Graza
Right, this is not a security issue but an accessibility one. Forms should have a submit button, not just a submit link.
Matthew Wilson
+4  A: 

It's bad practice, but the “dangers” are nothing to do with security.

Using a script-assisted link to submit a form instead of just having a submit button unnecessarily makes your form require JavaScript (so it won't work where JS is unavailable or broken due to other errors), and makes the link give affordances like “open in new window” and “bookmark link” that aren't appropriate and won't work for a form submission.

Use a normal input type="submit" button. If you really want it to look like a link for some reason, style it like one, for example:

input.linklike {
    color: blue; text-decoration: underline;
    border: none; padding: 0;
    width: auto; overflow: visible; /* hack for IE */
}
bobince