从下拉列表中选择后，PHP文件不会更新

Question

我有两个单独的文件，bargraph.html和data.php。

条形图的一部分：

<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>

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); 
?>

当我从两个下拉菜单中选择时，在我的browser console中，它以JSON格式打印所选数据和我的数据库中的值，但是当我通过data.php加载browser URL文件时，它正在打印SystemID和ApparentPower而不是所选数据。为什么是这样？有谁可以帮助我吗？

请参阅下面的浏览器控制台截图，从下拉列表中打印所选数据。 https://imgur.com/rdxgWaB

和从下拉InletCurrent和ActivePower中选择后通过浏览器加载的data.php的屏幕截图。 https://imgur.com/a/eiDeTLs

Answer 1

问题是dataType: 'html'您发布json数据但定义html尝试更改为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(){
            }
        });