根据从MYSQL表创建的下拉选择更改图像

时间:2019-03-15 17:16:28

标签: php mysql

我创建了一个PHP文件,该文件从MySQL表创建了下拉列表。选中后,我希望下拉列表中的每个条目都可以更改页面上显示的图像。我可以在下拉列表中显示最后一张图片,但是此后无法更改。

我需要使用javascript显示图像部分吗?

任何得到极大帮助的人(如果可能,请提供代码示例)

关于,           伊恩

<script  language=”Javascript”>

 function setImage(select){
     var image = document.getElementsByName("image-swap")[0];
     image.src = select.options[select.selectedIndex].value;
 }  

 </script>

 <?php
 $servername = "localhost";
 $username   = "xxxx";
 $password   = "xxxxxx";
 $dbname     = "xxxxxx";

 // Create connection
 $conn = new mysqli($servername, $username, $password, $dbname);
 // Check connection
 if ($conn->connect_error) {
       die("Connection failed: " . $conn->connect_error);
 } 

   // Select all data:

   echo "All Tartans:<br><br>";

  $sql = "SELECT ID, TartanID, Clan, Variation, Manufacturer, Supplement, SupplementVAT, ImagePath FROM Tartan";
  $result = $conn->query($sql);

   if ($result->num_rows > 0) 
   {
        // output data of each row into dropdown list
    ?>
       <select name="Tartan" id="Tartan" onchange="setImage(this);")
        <?php


         while($row = $result->fetch_assoc()) 
     {
          echo "ID: " . $row["ID"]. "<br>" . 
       "TartanID: " . $row["TartanID"]. "<br>" . 
       "Clan: " . $row["Clan"]. "<br>" . 
       "Variation: " . $row["Variation"]. "<br>" . 
       "Manufacturer: " . $row["Manufacturer"]. "<br>" . 
       "Supplement: " . $row["Supplement"]. "<br>" . 
       "SupplementVAT: " . $row["SupplementVAT"]. "<br>" . 
       "ImagePath: " . $row["ImagePath"]. "<br>"; 

    $clan = $row["Clan"];
    $img_path = $row["ImagePath"];

    echo "<option value='$Clan' >$clan</option>";

     }
   ?>
        </select>


    <!-- Display Image here -->


<div class="img-block">
    <img src="<?php echo $img_path; ?>" 
         name="image-swap" 
         alt="<?php echo $clan; ?>" 
         title="<?php echo $clan; ?>" 
         width="200" 
         height="200" class="img-responsive" />

</div>
<?php   

 }  
 else 
 {
     echo "0 results";
  }
   echo "<br>";

     $conn->close();
   ?>

0 个答案:

没有答案
相关问题