Question

我有一张桌子，上面有我的项目。最后一个单元格包含按钮SHOW IMAGE，该按钮应根据数据库中的数据加载图像URL（project_id =图像名称，例如“ 4189.jpg”）。

当我单击特定的SHOW IMAGE按钮时，如何修改代码以获取动态ID？实际上，我只需要获取被单击按钮的ID值并将此值设置为$image_id变量即可。

HTML结构

<table class="table table-hover all-projects text-center">
  <thead>
    <tr>
      <th scope="col">project's date</th>
      <th scope="col">quantity</th>
      <th scope="col">order no</th>
      <th scope="col">image</th>
    </tr>
  </thead>
  <tbody>
  <tr>
    <td>27.09.2018</td>
    <td>120</td>
    <td>15092018</td>
    <td><span id="1634" class="d-none display btn btn-info">SHOW IMAGE</span></td>
  </tr>
  <tr>
    <td>15.06.2018</td>
    <td>200</td>
    <td>2062018</td>
    <td><span id="4189" class="d-none display btn btn-info">SHOW IMAGE</span></td>
  </tr>
  </tbody>
</table>

AJAX请求：

<script type="text/javascript">

$(document).ready(function() {

   $(".display").click(function() {                

     $.ajax({    //AJAX REQUEST FOR show-image.php
       type: "GET",
       url: "modules/show-image.php",             
       dataType: "html",        
       success: function(response){                    
           $("#responsecontainer").html(response);
       }

   });
});
});
</script>

show-image.php

<?php 
session_start();
$get_user = $_SESSION['user'];

include("../db-conn.php");
mysqli_select_db($con,"projects");
$image_id = "4189"; //GET ID FROM BUTTON'S ID, NOW IT'S STATIC
$result=mysqli_query($con, "select * from projects where user = '$get_user' and project_id = '$image_id'");


  while($row = mysqli_fetch_array($result))  
  { 

  echo '<img class="img-fluid" src="../../img/projects/'. md5("$get_user") . "/" .  $row["project_id"] .'.jpg" alt="" />';

  }
echo "</table>";

?>

Answer 1

尝试一下，您可以使用onclick on @Entity public class Employee { @Id @GeneratedValue(strategy = GenerationType.IDENTITY) @Column(name = "id", nullable = false) private Long id; //... @ManyToMany(fetch = FetchType.LAZY, cascade = CascadeType.ALL) @JoinTable( name = "OrganizationMember", joinColumns = @JoinColumn(name = "employee_id", referencedColumnName = "id", table = "Member"), inverseJoinColumns = @JoinColumn(name = "organization_id", referencedColumnName = "id", table ="OrganizationMember") ) @Fetch(value = FetchMode.SUBSELECT) private List<Organization> organizationMemberList; } @Entity @Table(name = "OrganizationMember") @PrimaryKeyJoinColumn(name = "id", referencedColumnName = "id") @DiscriminatorValue("ORGANIZATION_MEMBER") public class OrganizationMember extends Member { //... } @Entity @Table(name = "Member") @Inheritance(strategy = InheritanceType.JOINED) public abstract class Member implements Serializable { //... }

在html上，

show image

在js上，

 <table class="table table-hover all-projects text-center">
  <thead>
    <tr>
      <th scope="col">project's date</th>
      <th scope="col">quantity</th>
      <th scope="col">order no</th>
      <th scope="col">image</th>
    </tr>
  </thead>
  <tbody>
  <tr>
    <td>27.09.2018</td>
    <td>120</td>
    <td>15092018</td>
    <td><a href="javascript:void(0)" onclick="showImage(1634)" id="1634" class="d-none display btn btn-info">SHOW IMAGE</a></td>
  </tr>
  <tr>
    <td>15.06.2018</td>
    <td>200</td>
    <td>2062018</td>
    <td><a href="javascript:void(0)" onclick="showImage(4189)" id="4189" class="d-none display btn btn-info">SHOW IMAGE</a></td>
  </tr>
  </tbody>
</table>

在php上，

<script type="text/javascript">

function showImage(id){
     $.ajax({    //AJAX REQUEST FOR show-image.php
       type: "GET",
       url: "modules/show-image.php?image_id="+id,             
       dataType: "html",      
       success: function(response){                    
           $("#responsecontainer").html(response);
       },
       error: function(jqXHR, textStatus, errorThrown){
          console.log(jqXHR);
       }
   });
}
</script>

也许可以帮助您

Answer 2

修改您的AJAX请求，以同时发送id属性的值...

<script type="text/javascript">
  $(document).ready(function() {
    $('.display').click(function() {
      $.ajax({
        type: 'GET',
        url: 'modules/show-image.php',
        data: {
          imageId: $(this).attr('id'),
        }
        dataType: 'html',
        success: function(response) {
          $('#responsecontainer').html(response);
        }
      });
    });
  });
</script>

...并将其包含并转义到您的PHP脚本中：

$image_id = mysqli_real_escape_string($_GET['imageId']);

还要检查是否已设置，否则可能会导致一些错误。

使用AJAX在SQL查询中获取按钮的ID

2 个答案: