Question

我正在用按钮在屏幕上显示记录列表，如下图所示。

现在我在弹出窗口上显示employee_id，因此管理员将单击“查看”按钮，然后弹出窗口将显示员工ID。

但是我的问题是，单击查看按钮时，我会在弹出窗口中获取所有员工列表。为什么会出现此问题，因为我在循环中查看了按钮。

      <td><a href="javascript:void(0);" id="open_popup">View</a>

我的脚本在这里

$(document).ready(function(){
              $("a#open_popup").click(function(){
                    $(".popup").show();  
               });  
 });

因此，当我单击任何视图按钮时，它会在弹出窗口中显示所有员工详细信息，并且我必须显示单个用户ID。

<?php if (!empty($get_emp_records)) {?>
<table class="table " >  
        <thead>
         <tr>  
          <th>Employee Name</th> 
           <th>Designation</th>  
           <th>Role</th>  
           <th>Status</th>  
           <th>Action</th>               
         </tr> 
          </thead>
         <?php  
         foreach ($get_emp_records as $row)  
         { $encryption_id=$this->encryption->encrypt($row->id);//encrpt the id ?>
            <tbody>
            <tr>   
            <td><?php echo $row->firstname;  echo $row->lastname;?></td>
            <td><?php echo $row->designation;?></td>  
            <td><?php echo $row->access_role;?></td>
            <?php if ($row->is_approved == 1): ?>
            <td><a href="javascript:void(0)">Approved</a></td>
            <?php else: ?>
            <td><a  href="#">Pending</a></td>
          <?php endif; ?>
          <td><a href="javascript:void(0);" id="open_popup">View</a> 
            <a href="<?php echo site_url('Employee_control/employee_archive?key='.$encryption_id)?>">Archive</a>
          </td>  

          <div class="popup"  style="display: none;">
            <p><?php echo $row->employee_id;?></p>
          </div>
            </tr>   
          </tbody> 
         <?php }       
         ?>              
   </table>  
<?php }else{echo "No record found";}?>

Answer 1

希望这对您有帮助：

在openPopup事件上在这样的视图锚点上添加函数onclick

<td>
   <a onclick="openPopup(this)" data-id="<?=$row->id;?>">View</a>
   ........ 
</td>

像这样将id提供给您的弹出div：

<div id="popup-<?=$row->id;?>"  style="display: none;">
   <p><?php echo $row->employee_id;?></p>
</div>

您的js函数openPopup应该是这样的：

<script type="text/javascript">

function openPopup(obj) 
{
    var id = $(obj).data('id');
    $("#popup-"+id).show();  
}

function closePopup(obj) 
{ 
   var id = $(obj).data('id'); 
   $("#popup-"+id).hide(); 
}; 
</script>

点击事件同时适用于所有视图按钮

1 个答案: