Submit form with anchor + javascript - bad practice?

Question

Dear Knowledge Base,

I currently have two anchor tags sending url queries to put votes inside a database, but i want to switch to using forms to keep the urls clean and avoid duplicate queries (not really an issue, but makes it look ugly).

Now the anchors need to contain a span-tag inside to add additional background elements to the buttons (links) through css, therefore I can't use regular form-buttons.

Do you consider submitting these forms from the anchors with javascipt as bad practice? I can think of some other solutions, but they all doesn't seem worth the trouble. Should I keep a no-script fallback where users with javascript disabled get to send url queries instead (i really want to avoid url queries altogether)? If, then how would this best be executed?

Thanks,
Simon.

Answer 1

you can use <button> in your form. it can contain content, and you can style it as you like.

you can make it look exactly as the <a> you have now, but clicking it will submit a POST form. It is almost as if we have a <a> that does POST!

Answer 2

Doing your buttons this way should work:

<button type="submit" value="upvote">
  <span>Vote Up</span>
</button>

<button type="submit" value="downvote">
  <span>Vote Down</span>
</button>

You should endeavor to never submit a form with JavaScript, or at the very least, ensure that the functionality is available when it is turned off.

Answer 3

I would recommend using the normal form submit button.
You can apply CSS to the button to make it look stylish or apply a background image.

I do not think the way you did it is a bad-practice. But the form will break for users who use add-ons like No-Script for Firefox.