Dynamically adding GET parameter to URL on form submit

Question

I have a simple form in a PHP application that I have to submit via POST method. Something like:

<form action="URL?page_id=10" method="POST">
    <select name="some_name" id="some_id">
        <option value='1'>...</option>
        <option value='2'>...</option>
        ...
    </select>
    ...
    //submit button here
</form>

The goal is to go to the following URL on submit:

URL?page_id=10&selected_id=SELECTED_ID

where SELECTED_ID is the value chosen by the user from the select drop down menu in the form. I've done it by converting the whole form to post the parameters as GET as I need to have this SELECTED_ID visible in the URL. However, another requirement turned up saying that I need to pass everything through POST and still have the SELECTED_ID visible in the URL and now I'm looking for alternatives.

So the question gets down to: how can I add dynamically another GET parameter to the URL upon POST form submission with one of the values submitted with the form?

Just append hidden input with that name (SELECTED_ID) into your form — hindmost
– hindmost, Commented Jul 22, 2015 at 11:16
You can only achieve that with JavaScript or by redirecting on the server side. — Quentin
– Quentin, Commented Jul 22, 2015 at 11:16
I cannot use hidden input as I don't know what value will be selected by the user. I have no problem using JavaScript here but how can I append something to the URL dynamically? — mmvsbg
– mmvsbg, Commented Jul 22, 2015 at 11:17
I think you should be able to add a selection listener to your options and use JavaScript to modify the form's action value. Don't have time to test it, though. — Marvin
– Marvin, Commented Jul 22, 2015 at 11:22

joker · Accepted Answer · 2015-07-22 11:22:15Z

1

first you have to add a id to your form as below

<form id='form1' action="URL?page_id=10" method="POST">

then add call below function on your button click

 function test(){
    $('#form1').attr('action', $(this).attr('formaction')+'&selected_id='+$('#some_id').val());
    }

answered Jul 22, 2015 at 11:22

joker

9909 silver badges23 bronze badges

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

2 Comments

mmvsbg Over a year ago

I had to change the "$(this)" with "$('#form1')" to make it work but it does the job as advertised. Thank you very much!

Preston Hager Over a year ago

I had to change the attr('formaction') to just attr('action') maybe this is something between version of jquery, but I got it to work. Thanks!

Ehab Eldeeb · Accepted Answer · 2015-07-22 11:22:38Z

1

use <form method="GET"> .. all the field values will be appended to the url automatically

answered Jul 22, 2015 at 11:22

Ehab Eldeeb

7284 silver badges12 bronze badges

3 Comments

mmvsbg Over a year ago

As noted in the question, I'm required to use POST on submission.

Guruprasad J Rao Over a year ago

using method = "GET" you cannot store values in server side!

Ehab Eldeeb Over a year ago

you can use javascript to achieve this, for example the select outside the form, and onchange() append to the url, and the rest of the form to be used as POST normally

Collectives™ on Stack Overflow

Dynamically adding GET parameter to URL on form submit

2 Answers 2

2 Comments

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related