I have a form which has 5 submit buttons like
<form action="pages/test.php" method="post" name="form1 "onsubmit="ajaxrequest('pages/test.php', 'resp'); return false;">
    <input type="hidden" name="Id" id ="Id" value=<?php echo "{$Id}"; ?> />
    <input type="submit" name="Value" value="0.01" />
    <input type="submit" name="Value" value="0.02" />
    <input type="submit" name="Value" value="0.03" />
    <input type="submit" name="Value" value="0.04" />
    <input type="submit" name="Value" value="0.05" />
</form>
<div id="resp">Here will be displayed the server response.</div><br />
The ajax processing for this is:
function get_XmlHttp() {
    var xmlHttp = null;
    if (window.XMLHttpRequest) {
        xmlHttp = new XMLHttpRequest();
    }
    else if (window.ActiveXObject) {
        xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
    }
    return xmlHttp;
}
// sends data to a php file, via POST, and displays the received answer
function ajaxrequest(php_file, tagID) {
    var request =  get_XmlHttp();
    var Id = document.getElementById('Id').value;
    var Value = document.getElementById('Value').value;
    // create pairs index=value with data that must be sent to server
    var  the_data = 'Id='+Id+'&Value='+Value;
    request.open("POST", php_file, true);
    request.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    request.send(the_data);
    request.onreadystatechange = function() {
        if (request.readyState == 4) {
            document.getElementById(tagID).innerHTML = request.responseText;
        }
    }
}
The test.php is:
$Id = strip_tags($_POST['Id']); $Value = strip_tags($_POST['Value']); echo "{$Id}, {$Value}";
The problem is that when clicking on any value in the form only the first value is ever displayed. How do I get it to recognise all the different submit values?
 
     
     
    