How to POST HTML form using `id` instead of `name`

Question

This following code will get element by name, I'm gonna change it to get element by ID, how to make it?

<?
if($_SERVER["REQUEST_METHOD"] == "POST" && array_key_exists("calculateFormSubmit", $_POST)) {
    $connectionData = ["server" => "","user" => "","pass" => "","database" => ""];
    $db = null;
    try {
      $db = new PDO("mysql:host=" . $connectionData["server"] . ";dbname=" . $connectionData["database"], $connectionData["user"], $connectionData["pass"]);
      $db->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
    } 
    catch(PDOException $e) {
      echo $e->getMessage();
    }

    $dateFrom = (int)$_POST["YearBox"] . "-" . (int)$_POST["gmonth"] . "-" . (int)$_POST["gday1"];
    $dateTo = (int)$_POST["gyear2"] . "-" . (int)$_POST["gmonth2"] . "-" . (int)$_POST["gday2"];
    $stmt = $db->prepare("SELECT SUM(rialamount) as sum_result FROM problem_tbl WHERE opening_date BETWEEN STR_TO_DATE(:date_from, '%Y-%c-%e') AND STR_TO_DATE(:date_to, '%Y-%c-%e')");

    $stmt->bindValue(":date_from", $dateFrom);
    $stmt->bindValue(":date_to", $dateTo);
    $stmt->execute();
    $userData = $stmt->fetchAll(PDO::FETCH_ASSOC);

    if($userData != false) {
    foreach ($userData as $idPatient) {
            header('Content-Type: text/html; charset=utf-8');
            echo "<p>Text Here </p>\n";
            echo "<div id=\"rialamount\" style=\"text-shadow: 2px 2px 5px #0B4D09; font-size: 140%;\">\n";
            echo       "<b>" .  ['']  .        "<b> - "  . $idPatient["sum_result"] . "<br />";
            echo "</div>\n";
    }
    }

    if($db !== null) {
        $db = null;
    }
}
?>

In the $dateFrom and $dateTo will get element by class name, How to change them to get element by ID ??

Thanks in advance

Solution 1

you cant not retrieve data in php via ID it works on name..so you neeed to change

PHP

<form method="POST" action="nextpage.php" name="myform" id="myform">
    <input type="text" id="rout_markers"  name="rout_markers"/>
    <input type="hidden" name="someNewName" id="someNewName" value="" />
    <input type="submit" id="send-btn"  class="button" value="SEND NOW" onclick="submitform()" />
</form>

jQuery

$("form").bind('submit',function(e){
  e.preventDefault();
  var hiddenData=$("input[name=rout_markers]").val();
  // or var hiddenData=jQuery('#rout_markers').val(); 
  $("input[type=hidden][name=someNewName]").val(hiddenData);  
});

nextpage.php

retrieve data below way

$_POST['someNewName'];

update

Set onclick=submitform() in submit button and also assign name and id attribute to form and write this

javascript

<script type="text/javascript">
    function submitform()
    {
        var hiddenData = document.getElementById('rout_markers').value;
        document.getElementById('someNewName').value = hiddenData;
        document.myform.submit();
    }
</script>

For more info, click getting values from ID instead of name

Solution 2

By default, an HTML form submits values keyed on the name attribute of the element.

You can modify this behavior using JavaScript by writing a function that handles the onsubmit action of the form and performing the submit yourself.

1. When the user hits <input type="submit"> or otherwise submits the form, the submit event is triggered
2. If you have a JavaScript function set to handle onsubmit, it will be called at this point
3. Your function should then create an HTTP POST request to the desired server resource (i.e. the one specified in the action attribute of the form and containing the code in the question). The POST data sent with this request can be keyed on ids or any other identifier you wish to use.
4. Your function should then cancel the form submit that would otherwise be initiated by the browser (e.g. return false)