Submitting a form with jquery using a non-default action script

Question

I am trying to use jquery to submit a form, but instead of the default action script that is in the form, I would like to submit the post variables to different action script instead.

More specifically, this is my default form that works a particular way when a user clicks the submit button:

<form method="post" action="something.php" id="myForm"> 
</form>

What I am trying to do is submit the form above, but instead of using the default something.php as the action script I would like to use the foo.php.

Is this even possible? This is what I tried, with no success (the post vars arent getting passed to the foo.php page):

$.post('foo.php', '#myForm', function(data) {
    alert(data);
});

I appreciate any suggestions on how to do this.

Many thanks in advance!

alex · Accepted Answer · 2013-03-31 23:27:04Z

2

If you simply want to change where the form posts to, then change the action attribute with JavaScript.

$('#myForm').attr('action', 'foo.php');

Only use $.post() if you intend to change the default behaviour to use an XHR instead of a normal whole-page refresh.

answered Mar 31, 2013 at 23:27

alex

492k205 gold badges891 silver badges992 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

AnchovyLegend Over a year ago

Thanks for the reply. Well, I want to temporarily change the action attribute. I would like to default action script to remain...

alex Over a year ago

@MiGusta Then you could store the original value, and replace it when you need to.

AnchovyLegend Over a year ago

+1, thank you, I like your method a lot, however, I ended up using the other one because It requires less code modification. Your way is a simpler solution however :D

Ram · Accepted Answer · 2013-03-31 23:33:11Z

1

Yes, this is possible of course, but you should pass a key-value pair, you can use .serializeArray() method.

$('#myForm').submit(function(e){
   e.preventDefault();
   $.post('foo.php', $(this).serializeArray(), function(data) {
       // alert(data);
   }); 
});

If you have a click handler:

$('#element').click(function(e){
   //e.preventDefault();
   $.post('foo.php', $('#myForm').serializeArray(), function(data) {
       // alert(data);
   }); 
});

edited Mar 31, 2013 at 23:33

answered Mar 31, 2013 at 23:25

Ram

145k16 gold badges174 silver badges201 bronze badges

2 Comments

AnchovyLegend Over a year ago

Thanks for the reply. How can I trigger this submit function? I am trying to manually trigger it... Because what I did is I placed the provided code in a click event so when a user clicks on some particular button, the code above gets executed, but the code above seems like an event listener, so I would need to trigger it manually...

Ram Over a year ago

@MiGusta If you have a click handler you don't need to listen to submit event, I have updated the answer.

Collectives™ on Stack Overflow

Submitting a form with jquery using a non-default action script

2 Answers 2

3 Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related