将表格结果传递到弹出窗口

问题描述 投票:0回答:1

我在td中放置了一个弹出触发器,因为我将表的一些数据传输到了弹出窗口中。但是,我无法从表中获取详细信息,因为我将主弹出窗口放置在while循环之外,因为弹出窗口显示多次,而不只是一个窗口。如何将表格结果传递给弹出窗口?

   $result = mysqli_query($conn, $sql);
   while($row = mysqli_fetch_assoc($result)) {
    $k=1;
  ?>
      <td>
          <a href="#0" id="info" class="info popup-trigger" title="info">View</a>
      </td>
      <td style="font-size:16px;"><STRONG><?php echo $row['eqdesc']; $eqid=$row['eq_inv_id'];?> 
      </STRONG></td>
      <td><?php echo $row['eq_inv_id']; ?></td>
      <td style="color:red; font-size:15px;"><strong><a href="timeline.php?emp_no=<?php echo 
       $row['empl_no'];?>" style="color:inherit;"><?php echo $row['empl_firstname']; ?></a></strong> 
       </td>
      <td style="color:red; font-size:15px;"><strong><a href="timeline.php?emp_no=<?php echo 
       $row['empl_no'];?>" style="color:inherit;"><?php echo $row['middlename']; ?></a></strong> 
        </td>
      <td style="color:red; font-size:15px;"><strong><a href="timeline.php?emp_no=<?php echo 
          $row['empl_no'];?>" style="color:inherit;"><?php echo $row['empl_lastname']; ?></a> 
      </strong></td>
      <td><?php echo $row['brand']; ?></td>
        <td><?php echo $row['serial_no']; ?></td>
        <td><?php echo $row['eq_state']; ?></td>
        <td><?php echo $row['eq_condition']; ?></td>
      <td><?php echo $row['curr_equip_loc']; ?></td>
      </tbody>
        <?php
        }
        ?>
      </table>
      </div>
      <div id="#0" class="popup" role="alert">
      <div class="popup-container">
      <a href="#0" class="popup-close img-replace">Close</a>
      <h2 class="modal-heading">EQUIPMENT INFORMATION</h2>
      <label>EMPL. NO.:<strong><?php echo $row['eq_inv_id'];?></strong></label><br>
      <label>FIRST NAME:</label><br>
      <label>MIDDLE NAME:</label><br>
      <label>LAST NAME:</label><br>
      <label>EQ DESCRIPTION:</label><br>
      <label>DESCRIPTION:</label><br>
      <label>BRAND:</label><br>
      <label>TAG NO.:</label><br>
      <label>SERIAL NO.:</label><br>
      <label>MODEL NO:</label><br>
      <label>IP ADDRESS:</label><br>
      <label>DATE ISSUED:</label><br>
      <label>EQ STATE:</label><br>
      <label>EQ CONDITION:</label><br>
      <label>DATE PURCHASED:</label><br>
      <label>AGE:</label><br><BR>
      <label>PRICE:</label><br>
      <label>LOCATION:</label><br>
      <label>REMARKS:</label><br>
      <label>PAR NO.:</label><br><BR>
      <button class="">UPDATE</button>
      <button class="">Assign this equipment to an employee</button>
      <button class="">EQ HISTORY</button>
      </div>
      </div>

      <script>
      jQuery(document).ready(function($){
      //open popup
        $('.popup-trigger').on('click', function(event){
       event.preventDefault();
        $('.popup').addClass('is-visible');
        });

       //close popup
       $('.popup').on('click', function(event){
      if( $(event.target).is('.popup-close') || $(event.target).is('.popup') ) {
       event.preventDefault();
      $(this).removeClass('is-visible');
      }
      });
      //close popup when clicking the esc keyboard button
      $(document).keyup(function(event){
    if(event.which=='27'){
    $('.popup').removeClass('is-visible');
     }
    });
    });
    </script>

enter image description hereenter image description here

php jquery css popup popupwindow
1个回答
0
投票

更新

我无法通过组合模式显示并从按钮获取设备ID值来弹出模式,因此我在脚本中将两者分开。一个将弹出模态,另一个将从按钮获取值。模态的显示已经可以正常工作,但是在模态或弹出窗口中均未输出错误消息或数据库中的任何数据。这是我的代码:

    $result = mysqli_query($conn, $sql);
  while($row = mysqli_fetch_assoc($result)) {
   ?>

      <td>
         <a href="#0" id="info" class="info popup-trigger" 
         onclick="showDetails(this)" eqid="<?php echo $row['eq_inv_id']; ?>" 
         title="info">View</a>
      </td>
      <td><?php echo $row['eq_inv_id']; ?></td>
      <td style="font-size:16px;"><STRONG><?php echo $row['eqdesc'];?> 
       </STRONG></td>
      <td style="color:red; font-size:15px;"><strong><a href="timeline.php? 
      emp_no=<?php echo $row['empl_no'];?>" style="color:inherit;"><?php 
       echo $row['empl_firstname']; ?></a></strong></td>
      <td style="color:red; font-size:15px;"><strong><a href="timeline.php? 
       emp_no=<?php echo $row['empl_no'];?>" style="color:inherit;"><?php 
        echo $row['middlename']; ?></a></strong></td>
      <td style="color:red; font-size:15px;"><strong><a href="timeline.php? 
          emp_no=<?php echo $row['empl_no'];?>" style="color:inherit;"><?php 
        echo $row['empl_lastname']; ?></a></strong></td>
      <td><?php echo $row['brand']; ?></td>
        <td><?php echo $row['serial_no']; ?></td>
        <td><?php echo $row['eq_state']; ?></td>
        <td><?php echo $row['eq_condition']; ?></td>
      <td><?php echo $row['curr_equip_loc']; ?></td>
       </tbody>
           <?php
         }
           ?>
       </table>
        </div>
          <div class="popup" role="alert">
          <div class="popup-container">
          <a href="#0" class="popup-close img-replace">Close</a>
          <h2 class="modal-heading">EQUIPMENT INFORMATION</h2>
          <label>EQ NO.:</label><strong><span id="eq_inv_id"></span> 
      </strong><br>
  <label>EMPL. NO.:</label><strong><span id=""></span></strong><br>
 <label>FIRST NAME:</label><strong><span id=""></span></strong><br>
 <label>MIDDLE NAME:</label><strong><span id=""></span></strong><br>
 <label>BRAND:</label><strong><span id=""></span></strong><br>
 <label>TAG NO.:</label><strong><span id=""></span></strong><br>
 <label>SERIAL NO.:</label><strong><span id=""></span></strong><br>
 <label>MODEL NO:</label><strong><span id=""></span></strong><br>
 <label>IP ADDRESS:</label><strong><span id=""></span></strong><br>
 <label>DATE ISSUED:</label><strong><span id=""></span></strong><br>
 <label>EQ STATE:</label><strong><span id=""></span></strong><br>
 <label>EQ CONDITION:</label><strong><span id=""></span></strong><br>
 <label>DATE PURCHASED:</label><strong><span id=""></span></strong><br>
 <label>AGE:</label><br><strong><span id=""></span></strong><BR>
 <label>PRICE:</label><strong><span id=""></span></strong><br>
 <label>LOCATION:</label><strong><span id=""></span></strong><br>
 <label>REMARKS:</label><strong><span id=""></span></strong><br>
 <label>PAR NO.:</label><br><strong><span id=""></span></strong><BR>
 <button class="">UPDATE</button>
 <button class="">Assign this equipment to an employee</button>
 <button class="">EQ HISTORY</button>
 </div>
 </div>

脚本

<script type='text/javascript'>

  jQuery(document).ready(function(){
  function showDetails(button) {

var invId = button.eqid;
//AJAX call to get specific equipment data
$.ajax({
  url: "test.php",
  method: "GET",
  data: {"invId": invId},
  success: function(response) {
    // Parsing the JSON string to javascript object
    var equipment = JSON.parse(response);
    //Displaying in proper field
    $("#eq_inv_id").text(equipment.eq_inv_id);
      }
    });
   }

      //open popup
    $('.popup-trigger').on('click', function(event){
   event.preventDefault();
    $('.popup').addClass('is-visible');
  });

  //close popup
   $('.popup').on('click', function(event){
  if( $(event.target).is('.popup-close') || $(event.target).is('.popup') ) {
   event.preventDefault();
  $(this).removeClass('is-visible');
  }
  });
  //close popup when clicking the esc keyboard button
  $(document).keyup(function(event){
   if(event.which=='27'){
   $('.popup').removeClass('is-visible');
    }
   });
   });

 </script>

test.php

    <html>
    <head>
    </head>
     <?php
  include "header.php";
  $a=$_POST['eqid'];
   ?>
  </body>
  </html>
© www.soinside.com 2019 - 2024. All rights reserved.