Tuesday, April 7, 2009

Form input names with reserved words and JQuery

When you have an HTML form that contains an input field with the name of "action" or "submit" - submitting a form via javascript becomes problematic.

Normally, Jquery users would simply call $("#formid").submit() after referencing a form. However, if your form contains an input field named "submit" (like <input name="submit">) then $("#formid").submit() does not submit the form.

This is my workaround - essentially programatically clicking the submit button, instead of programatically submitting the form.

<html>
<head>
<script src="jquery-1.3.2.js"></script>

<script>
$(document).ready(function() {
alert('action=' + $("#formid").attr("action"));
alert('try to submit');
$("#sneaky").click();
});
</script>

</head>
<body>
<form action="http://www.testdomain.net/actionworksok" id="formid">
<input type=submit name=testname id=sneaky>
<input name=action value=test1>
<input name=submit value=test2>
</form>
</body>
</html>

No comments: