从onchange函数中选择html更改其他选择html

时间:2018-02-22 06:57:03

标签: javascript php mysql

我有一个包含select sql语句的select html。我们称之为选择A.如果选择A更改为值,则选择B并选择C将根据选择A的select sql语句中的数据进行更改。 我尝试和失败的方法是围绕使用选择A上的onchange。它将调用一个函数。但是,此函数需要从php变量中读取以获取值。但我们知道PHP在javascript中不起作用。

我能想到的另一种方法是在选择A的onchange上再次使用窗口刷新功能。刷新的页面然后$ _GET来自url链接的值(例如:terminalassign.php?id=1&terminalposition=here& ...) 但它再次使用onchange,因此无法在javascript中获取PHP值。

任何人都有任何想法可以解决这个问题吗?

这是我的代码:

onchange上的功能

<script language="Javascript" type="text/javascript">
  function terminalupdate() {
    var terminalposition = <?php echo (json_encode($terminalposition)) ;?>
    var terminalstatus = <?php echo (json_encode($terminalstatus)); ?>
    document.getElementById("terminalposition").value=terminalposition;
    document.getElementById("terminalstatus").value=terminalstatus;
  }
</script>

        <td><p id="spacing" align="left">Terminal ID</p></td>
            <?php
            $sql2 = "SELECT * FROM terminal WHERE merchantid IS NULL ORDER BY terminalaccountno ASC";
            $RS2 = mysql_query($sql2, $db);
            $rows = array();
            while ($row = mysql_fetch_array($RS2))
                $rows[] = $row;
            ?>
            <td id="spacing" style="padding-left:100px">
                <select name="terminalid" onchange="terminalupdate()" required>
             <?php
            foreach ($rows as $row) {
             echo "<option value='$row[terminalid]'>$row[terminalaccountno]</option>";
             $terminalstatus = $row['terminalstatus'];
             $terminalposition = $row['terminalposition'];
            }
             ?>
                </select>
                <?php if (!empty($merchantaddresserror)): ?><br>
                    <span class="spanstyle"><?php echo $merchantaddress;?></span>
                <?php endif; ?><br>
            </td>
        </tr>
        <tr>
            <td><p id="spacing" align="left">Status</p></td>
            <td id="spacing" style="padding-left:100px">
                <select name="terminalstatus" id="terminalstatus" required>
                    <option value="" <?php if($terminalstatus=="") echo 'selected="selected"'?>> </option>
                    <option value="active" <?php if($terminalstatus=="active") echo 'selected="selected"'?>>Active</option>
                    <option value="inactive" <?php if($terminalstatus=="inactive") echo 'selected="selected"'?>>Inactive </option>
                    <option value="lost" <?php if($terminalstatus=="lost") echo 'selected="selected"'?>>Lost</option>
                </select>
            </td>
        </tr>
        <tr>
            <td><p id="spacing" align="left">Terminal Position</p></td>
            <td id="spacing" style="padding-left:100px">
                <select name="terminalposition" required>
                    <option value="" <?php if($terminalposition=="") echo 'selected="selected"'?>> </option>
                    <option value="Deployed" <?php if($terminalposition=="Deployed") echo 'selected="selected"'?>>Deployed</option>
                    <option value="Used By Developer" <?php if($terminalposition=="Used By Developer") echo 'selected="selected"'?>>Used By Developer</option>
                    <option value="Sent For Repair" <?php if($terminalposition=="Sent For Repair") echo 'selected="selected"'?>>Sent For Repair</option>
                    <option value="Write-Off" <?php if($terminalposition=="Write-Off") echo 'selected="selected"'?>>Write-Off</option>
                    <option value="Stolen" <?php if($terminalposition=="Stolen") echo 'selected="selected"'?>>Stolen</option>
                </select>

1 个答案:

答案 0 :(得分:0)

因此,在 Ajax

的帮助下,事情变得更容易

首先在更改第一个下拉列表时调用JavaScript函数,其中包含ajax调用。

function loadData() {
  var xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
      // populate both dropdown using result of getData.php file
      // You can acccess the values using this.responseText.dropdown2 and this.responseText.dropdown3
      console.log(this.responseText);
    }
  };
  xhttp.open("GET", "getData.php?param=abc", true);
  xhttp.send();
}

getData.php文件中: -

<?php
  $param = $_GET['param'];  // will give you 'abc'
  //mysql queries goes here and get result for second and third dropdown 
  //then echo the result of the query.
  echo array('dropdown2'=>$dropdown2, 'dropdown3'=>$dropdown3);
?>