-1

I have two separate files, bargraph.html and data.php.

Part of bargraph:

<form method="POST" name="dataform" action="" id='dataForm'>
  <select id="data1" name="data1">
    <option value=""></option>
    <option value="DateRecorded">DateRecorded</option>
    <option value="InletVoltage">InletVoltage</option>
    <option value="InletCurrent">InletCurrent</option>
    <option value="ActivePower">ActivePower</option>
    <option value="ApparentPower">ApparentPower</option>
    <option value="PowerFactor">PowerFactor</option>
    <option value="SystemID">SystemID</option>
    </select>
    <select id ="data2" name="data2">
    <option value=""></option>
    <option value="DateRecorded">DateRecorded</option>
    <option value="InletVoltage">InletVoltage</option>
    <option value="InletCurrent">InletCurrent</option>
    <option value="ActivePower">ActivePower</option>
    <option value="ApparentPower">ApparentPower</option>
    <option value="PowerFactor">PowerFactor</option>
    <option value="SystemID">SystemID</option>
  </select>
  <button type="button" id="submitButton" name="submitButton">Submit</button>
</form>

<script type="text/javascript">

$('#submitButton').click(function(e) {
      var data1 = $("#data1").val();
      var data2 = $("#data2").val();

        $.ajax({
            type: 'post',
            url: 'data.php',
            dataType: 'html',
            data: {data1:data1,data2:data2},
            success: function(data){ 
                console.log(data);
                console.log('#dataForm');
            }, 
            error: function (xhr, ajaxOptions, thrownError){
                console.log(thrownError);
            }, 
            complete: function(){
            }
        });
        e.preventDefault();
    });

</script>

Part of data.php:

if (isset($_POST['data1'])) { 
    $opp1 = $_POST['data1']; 
} else { 
    $opp1 = 'SystemID'; 
}
if (isset($_POST['data2'])) { 
    $opp2 = $_POST['data2']; 
} else { 
    $opp2 = 'ApparentPower'; 
}

$sql = "SELECT $opp1, $opp2 FROM RaritanMachineDataa"; 
$result = sqlsrv_query($conn, $sql); 
$data = array(); 
while ($row = sqlsrv_fetch_array($result, SQLSRV_FETCH_ASSOC)) {
    $row = preg_replace("/[^0-9]/", "", $row);
    $data[] = $row; 
}
sqlsrv_free_stmt($result); 
sqlsrv_close($conn); 
echo json_encode($data); 
?>

When I select from the two drop down menus, in my browser console, it prints that chosen data in JSON format and the values from my database, however when I load the data.php file via browser URL, it is printing SystemID and ApparentPower and not the chosen data. Why is this? Can someone help me please?

See below screenshot of browser console printing the chosen data from drop downs. https://imgur.com/rdxgWaB

and screenshot of data.php loaded via browser after choosing from drop down InletCurrent and ActivePower. https://imgur.com/a/eiDeTLs

aaaaane
  • 187
  • 1
  • 15
Danny
  • 135
  • 8
  • 1
    That's exactly the behaviour you've programmed. If POST `data1` is not set use `SystemID` if POST `data2` is not set use `ApparentPower`. Browsing `data.php` is a GET request thus no POST arguments are set. – Sebastian Feb 26 '19 at 09:46
  • @Sebastian How do I go about fixing this so it loads the POST data in my data.php via browser URL? – Danny Feb 26 '19 at 09:47
  • You could use query parameters [See php GET variables](https://secure.php.net/manual/en/reserved.variables.get.php). But in this case you have to update your ajax-call to also use query params. – Sebastian Feb 26 '19 at 09:51
  • @Sebastian Okay I have tried replacing POST in my data.php file with GET instead.. Am I doing it correctly? I cannot find an example online close to my program. Could you provide an example for my code on how to use GET please? – Danny Feb 26 '19 at 09:56
  • Just use $_GET instead of $_POST. And in the url you use something like `data.php?data1=SystemID&data2=ApparentPower`. [See this post for more details](https://stackoverflow.com/questions/5884807/get-url-parameter-in-php) – Sebastian Feb 26 '19 at 10:01
  • @Sebastian I don't want the page to change when user clicks on "submit". I want the data to be inserted into the select query in data.php and then outputted to data.php when loading via URL. Is that possible to do? Because I have another JS file which read from the data.php file and updates a chart based on the data. – Danny Feb 26 '19 at 11:11

1 Answers1

0

The problem is dataType: 'html' You post the json data but define the html Try to change to json :

         $.ajax({
            type: 'post',
            url: 'data.php',
            dataType: 'json',
            data: {data1:data1,data2:data2},
            success: function(data){ 
                console.log(data);
                console.log('#dataForm');
            }, 
            error: function (xhr, ajaxOptions, thrownError){
                console.log(thrownError);
            }, 
            complete: function(){
            }
        });
Ryuk Lee
  • 720
  • 5
  • 12