onChange JavaScript到SQL查詢

Question

所以我知道有100％的方法可以做到這一點，但我認為我做的不正確。 這幾乎就是我編寫此代碼的目標。

我希望用戶能夠以30分鍾（最多5小時）的間隔選擇時間。 （然后是10個選項）。每隔30分鍾向變量添加一個.5，則調用D。

變量I，E和T依賴於變量D。

我目前有一個下拉列表，其中包含有關更改的JavaScript。 但是之后，我需要使用變量D，I，E和T更新MYSQL服務器中的記錄。

這是我到目前為止的代碼：

<form name="Tame" method="POST">
  <select id="VariableD" onchange="myFunction()">
    <option value=".5">30 mins
    <option value="1">1 hour
    <option value="1.5">1 hour 30 mins
    <option value="2">2 hours
    <option value="2.5">2 hour 30 mins
    <option value="3">3 hour
    <option value="3.5">3 hours 30 mins
    <option value="4">4 hours
    <option value="4.5">4 hours 30 mins
    <option value="5">5 hour     
  </select>
  <input type="hidden" name="VariableI" value="2">
  <input type="hidden" name="VariableT" value="4">
  <input type="hidden" name="VariableE" value="10">
  <input type="submit" name="TameSub" value="Tame">
</form>

然后我有我的JavaScript：

<script>
  function myFunction() {
    var x = document.getElementById("VariableD").value;
    var TameEnergy = x * 10;
    var TameIntell = x * 2;
    var TameGain =   x * 4;

    var En = document.getElementById("VariableE");
    var Intell = document.getElementById("VariableI");
    var Tame = document.getElementById("VariableE");

    En.value = TameEnergy;
    Intell.value = TameIntell;
    Tame.value = TameGain;
  }
</script>

在有了腳本來確定所有變量之后，我就有了這個供PHP更新記錄：

<?php
  $SubTame = $_POST['TameSub'];
  $I = $_POST['VariableI'];
  $E = $_POST['VariableE'];
  $T = $_POST['VariableT'];

  if($SubTame) {
    $sql = "UPDATE Horse SET Energy='$E', IntelligenceP='$I', Taming='$T' WHERE id='$colname_HorseInfo'";
    if ($con->query($sql) === TRUE) {
    ?>
      <script>location.reload();</script>
      <?php
    } else {}
  }
?>

當我以這種方式進行操作時，我會進行記錄更新，但它只會按照表單中的默認值進行更新，這意味着更新時不會識別JavaScript中的任何更改。 如果有人可以向我解釋在這種情況下我將如何做，那么我願意使用AJAX進行此操作。

Answer 1

無需添加js代碼，而是直接在php中進行操作。

在html中出現任何錯誤之前：

<select I'd="VariableD" onchange="myFunction()">
should be
<select id="VariableD" name="VariableD" onchange="myFunction()">

現在在php中，這將不需要js代碼

$val=$_POST['VariableD']; //see reference below for exact code
$I=$val*10;
//set other variables
//execute query

如果像這樣更改php，則在html中也不需要onchange（）。

有關如何在php中選擇下拉列表值的正確參考， 需要在php / html中將variable =設置為下拉列表選擇

Answer 2

Onchange，您需要通過js提交表單

<form id="abc" name="Tame" method="POST">
.............
 </form>

<script>
        function myFunction() 
        {

.................
            document.getElementById("abc").submit();


        }
        </script>

Answer 3

您的<select>沒有名稱。 但是我將大大簡化此過程，並將邏輯移入php。 一旦有人選擇了內容，onchange =“ submit（）”將立即處理該表單，這時您立即將所有數據保存在$_POST因此可以跳過js函數。

考慮以下：

<?php
if( isset( $_POST ) ) {

    $varD = $_POST["VariableD"];

    $TameEnergy = $varD * 10;
    $TameIntell = $varD * 2;
    $TameGain =   $varD * 4;

    $varE = $_POST["VariableE"];
    $Intell =  $_POST["VariableI"];
    $Tame =  $_POST["VariableE"];

    //do something else
}
?>

<h3>Make a selection: </h3>
<form name="Tame" method="POST">
        <select name="VariableD" onchange="submit()">
          <option value=".5">30 mins
          <option value="1">1 hour
          <option value="1.5">1 hour 30 mins
          <option value="2">2 hours
          <option value="2.5">2 hour 30 mins
          <option value="3">3 hour
          <option value="3.5">3 hours 30 mins
          <option value="4">4 hours
          <option value="4.5">4 hours 30 mins
          <option value="5">5 hour     
        </select>
        <input type="hidden" name="VariableI" value="2">
        <input type="hidden" name="VariableT" value="4">
        <input type="hidden" name="VariableE" value="10">
</form>