表格行由下拉选项填充

时间:2016-09-23 00:50:16

标签: php html mysql ajax

我有一个从数据库填充的下拉列表(它是表行中的第一个单元格)然后根据该选择我希望它从同一个数据库填充该行的其余部分,每个单元格是一个不同的表在数据库中,到目前为止我只填充了第一个单元格(卡路里),我无法弄清楚如何填充其余的单元格,谢谢

<?php
$link=mysqli_connect("localhost", "root", "");
mysqli_select_db($link,"meal_planner");
?>
<!DOCTYPE html>
<html>
<head>
<title>Meal Planner</title>
    <link href="main2.css" rel="stylesheet" type="text/css" />
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
    <script type="text/javascript">
      jQuery(document).ready(function($){

        // Hide all panels to start
        var panels = $('.accordion > dd').hide();

        // Show first panel on load (optional). Remove if you want
        panels.first().show();

        // On click of panel title
        $('.accordion > dt > a').click(function() {
          var $this = $(this);

          // Slide up all other panels
          panels.slideUp();

          //Slide down target panel
          $this.parent().next().slideDown();

          return false;
        });
      });
    </script>
<script>
function showUser(str) {
    if (str == "") {
        document.getElementById("txtHint").innerHTML = "";
        return;
    } else { 
        if (window.XMLHttpRequest) {
            // code for IE7+, Firefox, Chrome, Opera, Safari
            xmlhttp = new XMLHttpRequest();
        } else {
            // code for IE6, IE5
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
        }
        xmlhttp.onreadystatechange = function() {
            if (this.readyState == 4 && this.status == 200) {
                document.getElementById("txtHint").innerHTML = this.responseText;
            }
        };
        xmlhttp.open("GET","getuser.php?q="+str,true);
        xmlhttp.send();
    }
}
</script>
</head>
<body>
  <dl class="accordion">
      <dt><a href="">Monday</a></dt>
      <dd>
      <table>
    <tr>
      <th>Breakfast</th>
      <th>Calories</th>
      <th>Protein</th>
      <th>Carbs</th>
      <th>Fat</th>
      <th>Serving Sizing</th>
    </tr>
    <tr>
    <td>
    <select name="breakfa"s onchange="showUser(this.value)">
     <option value="">Select a Protein:</option>
     <?php
     $res=mysqli_query($link,"select name, protein_id from protein");
     while($row=mysqli_fetch_array($res))
     {
     ?>
     <option value="<?php echo $row["protein_id"]; ?>"><?php echo $row["name"]; ?></option>
     <?php
     }
     ?>

     </select>
    </td>
    <td><div id="txtHint"><b>0</b></div></td>
    <td>50</td>
    <td>50</td>
    <td>50</td>
    <td><input type="" name=""></td>
    </tr>
  </table>
  </dd>

      <dt><a href="">Tuesday</a></dt>
      <dd>TEST</dd>

      <dt><a href="">Wednesday</a></dt>
      <dd>TEST.</dd>
    </dl>
  </body>
</html>

php

<?php
$q = intval($_GET['q']);

$con = mysqli_connect('localhost','root','','meal_planner');
if (!$con) {
    die('Could not connect: ' . mysqli_error($con));
}

mysqli_select_db($con,"ajax_demo");
$sql="SELECT * FROM protein WHERE protein_id = '".$q."'";
$result = mysqli_query($con,$sql);


while($row = mysqli_fetch_array($result)) {
    echo "<tr>";
    echo "<td>" . $row['calories'] . "</td>";
    echo "</tr>";
}
echo "</table>";
mysqli_close($con);
?>

0 个答案:

没有答案