How can I set the form action through JavaScript?
I have an HTML form whose action should be set dynamically through JavaScript. How do I do it?
Here is what I am trying to achieve:
<script type="text/javascript">
function get_action() { // Inside script tags
return form_action开发者_StackOverflow社区;
}
</script>
<form action=get_action()>
...
</form>
You cannot invoke JavaScript functions in standard HTML attributes other than onXXX
. Just assign it during window onload.
<script type="text/javascript">
window.onload = function() {
document.myform.action = get_action();
}
function get_action() {
return form_action;
}
</script>
<form name="myform">
...
</form>
You see that I've given the form a name
, so that it's easily accessible in document
.
Alternatively, you can also do it during submit
event:
<script type="text/javascript">
function get_action(form) {
form.action = form_action;
}
</script>
<form onsubmit="get_action(this);">
...
</form>
Plain JavaScript:
document.getElementById('form_id').action; //Will retrieve it
document.getElementById('form_id').action = "script.php"; //Will set it
Using jQuery...
$("#form_id").attr("action"); //Will retrieve it
$("#form_id").attr("action", "/script.php"); //Will set it
Very easy solution with jQuery:
$('#myFormId').attr('action', 'myNewActionTarget.html');
Your form:
<form action=get_action() id="myFormId">
...
</form>
Actually, when we want this, we want to change the action depending on which submit button we press.
Here you do not need even assign name
or id
to the form. Just use the form
property of the clicked element:
<form action = "/default/page" >
<input type=submit onclick='this.form.action="/this/page";' value="Save">
<input type=submit onclick='this.form.action="/that/page";' value="Cancel">
</form>
Change the action URL of a form:
<form id="myForm" action="">
<button onclick="changeAction()">Try it</button>
</form>
<script>
function changeAction() {
document.getElementById("myForm").action = "url/action_page.php";
}
</script>
document.forms[0].action="http://..."
...assuming it is the first form on the page.
Do as Rabbott says, or if you refuse jQuery:
<script type="text/javascript">
function get_action() { // inside script tags
return form_action;
}
</script>
<form action="" onsubmit="this.action=get_action();">
...
</form>
Setting form action after selection of option using JavaScript
<script>
function onSelectedOption(sel) {
if ((sel.selectedIndex) == 0) {
document.getElementById("edit").action =
"http://www.example.co.uk/index.php";
document.getElementById("edit").submit();
}
else
{
document.getElementById("edit").action =
"http://www.example.co.uk/different.php";
document.getElementById("edit").submit();
}
}
</script>
<form name="edit" id="edit" action="" method="GET">
<input type="hidden" name="id" value="{ID}" />
</form>
<select name="option" id="option" onchange="onSelectedOption(this);">
<option name="contactBuyer">Edit item</option>
<option name="relist">End listing</option>
</select>
精彩评论