pass several parameters to php using js - php

Question

I have some problems when trying to pass some parameters to PHP via JS.
Here's the situation:
HTML:
<form id="numbtns" method="post" action="imphp.php">
<button id="1" onClick="pass(this.id)">1</button>
<button id="2" onClick="pass(this.id)">2</button>
<button id="3" onClick="pass(this.id)">3</button>
<button id="confirm" onClick="save()">submit</button>
</form>
JS:
pass(clicked_id) {
var btn = document.getElementById(clicked_id);
**// I have no idea what to do next to give the ids to the php file.**
}
save() {
**// I want function save() to collect the parameters from function pass(), and pass them to 'imphp.php' when submit button is clicked. I'm stuck here.**
}
PHP:
// connection part, let's skip it.
...
$num = $_POST['num'];
$query = sprintf("SELECT id, num FROM tb WHERE num = $num");
I know maybe it's a quick and stupid question for u, but I cannot figure it out for hours. So... could anyone help me out, I'd be very appreciate that.
Thx in advance.

Answer 1

I don't think you need Javascript for this. All you want to do is post the form to the PHP page, right?
<form id="numbtns" method="post" action="imphp.php">
<input type="radio" name="num" value="1" /> 1<br />
<input type="radio" name="num" value="2" /> 2<br />
<input type="radio" name="num" value="3" /> 3<br />
<input type="submit" value="Save" />
</form>
Using buttons made no sense to me at all, so I changed them to radio buttons. The user will check one, then click the Save button to submit the form.

Answer 2

You need to use AJAX... i would recommend simplifying the process with a javascript library like jQuery... here is a tutorial using jQuery / AJAX / PHP: http://www.php4every1.com/tutorials/jquery-ajax-tutorial/

Answer 3

This is a very frequently asked question in one of several forms, as you can see by looking under the Related heading to the right on this page.
I see this a lot and there seems to be a fundamental flaw in many people's understanding of how PHP and Javascript work, so I wanted to throw this out there.
PHP runs on the server, executing the code in the .php page and modules there, and produces output which is sent to the browser. PHP is now done. Stopped. Fini. You PHP code is no longer running.
The web browser receives the output, builds the DOM tree, and starts rendering the HTML as a page and executing the Javascript. The Javascript can't pass parameters to the PHP because the PHP is no longer running. It has terminated execution. Kaput. In addition, the Javascript is running in the browser, on the client machine, while the PHP runs on the server.
What you can do is invoke some new PHP (or re-invoke the same PHP code to do something else) and that is usually done be making an AJAX call from Javascript, as #Jeffery A Wooden suggests in his answer.

Answer 4

HTML, though I'd suggest changing the button elements to <input type="button" ...> elements
<form id="numbtns" method="post" action="imphp.php">
<input type="hidden" name="buttonID" value="1" />
<input type="button" onClick="pass(this)" value="1" />
<input type="button" onClick="pass(this)" value="2" />
<input type="button" onClick="pass(this)" value="2" />
<input type="submit" id="confirm" value="Submit" />
</form>
Javascript:
function pass(button) {
document.getElementById("buttonId").value = button.value;
}