Question

我有一个php网站，显示MySQL数据库中的表信息。我创建了一个js，该js将在单击行表时弹出。问题在于它将仅在第一行上起作用，而其余部分则不起作用。我还想显示捕获到的信息，该信息是从单击它的行显示到弹出/对话框中的。谢谢！

这是我的桌子

<tr id="popup" style="cursor: pointer;">
<td hidden="text"><?php echo odbc_result($result,"OBGyneID"); ?></td>
<td><?php echo odbc_result($result,"Lname"); ?>
    , &nbsp;<?php echo odbc_result($result,"Fname"); ?>
    &nbsp;<?php echo odbc_result($result,"mi"); ?></td>
<td class="hidden-ob-xs"><?php echo odbc_result($result,"Bday");?></td>
<td class="hidden-ob-xs"><?php echo odbc_result($result,"pxAge"); ?></td>
<td class="hidden-ob-xs hidden-ob-sm"><?php echo odbc_result($result,"PhoneNum"); ?></td>    
<td><?php  echo odbc_result($result,"service"); ?></td>  
<td class="hidden-ob-xs hidden-ob-sm"><?php echo odbc_result($result,"obgyneTime"); ?></td>                                                  
</tr>

这是我的JS

        $('#popup').click(function(){
            swal({
                title:  'Are you sure you want to delete this record?',
                text: 'You will not be able to recover this record again!',
                type: 'warning',
                showCancelButton: true,
                buttonsStyling: false,
                confirmButtonClass: 'btn btn-danger',
                confirmButtonText: 'Yes, delete it!',
                cancelButtonClass: 'btn btn-light',
                background: 'rgba(0, 0, 0, 0.96)'
            }).then(function(){
                swal({
                    title: 'Are you sure?',
                    text: 'You will not be able to recover this imaginary file!',
                    type: 'success',
                    buttonsStyling: false,
                    confirmButtonClass: 'btn btn-light',
                    background: 'rgba(0, 0, 0, 0.96)'
                });
            });
        });

Answer 1

我认为您正在尝试删除一条记录。因此，以下代码可能有用。您可能需要传递您的记录ID，以备将来删除 #id变量对于每一行必须唯一。尝试下面的代码

HTML

 <tr onclick="myFunction( <?php print $recid; ?> )"> <tr>

JS

  myFunction(recid){
      swal({
        title: "Are you sure you want to delete this record?",
        text: "Once deleted, you will not be able to recover this record !",
        icon: "warning",
        buttons: true,
        dangerMode: true,
        closeOnClickOutside: false,
        closeOnEsc: false
    })
    .then((willDelete) => {
        if(willDelete) {

          // Here make a POST request to delete your record using recid paramter

        } else {
            // do nothing
        }
    });
 }

请随时提出疑问。如果有帮助，请对此答案进行投票/标记。

Answer 2

在TR标签上添加类

<tr class="popup" data-company="Google" style="cursor: pointer;">

更改此类以调用弹出窗口

 $('.popup').click(function(){

    var company = $(this).data('company');

     /* your code */

 });

Answer 3

检查以下代码。希望对您有帮助。

$('.test').on('click', function(){
	// this is your table id
	var dataId = $(this).attr('data-id');
  swal({
    title:  'Are you sure you want to delete this record?',
    text: 'You will not be able to recover this record again!',
    type: 'warning',
    showCancelButton: true,
    buttonsStyling: false,
    confirmButtonClass: 'btn btn-danger',
    confirmButtonText: 'Yes, delete it!',
    cancelButtonClass: 'btn btn-light',
    background: 'rgba(0, 0, 0, 0.96)'
  }).then(function(){
  	// Add your ajax code here
    swal({
      title: 'Success',
      text: 'Record Deleted Suucessfully',
      type: 'success',
      buttonsStyling: false,
      confirmButtonClass: 'btn btn-light',
      background: 'rgba(0, 0, 0, 0.96)'
    });
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/2.1.2/sweetalert.min.js"></script>
<table border="1">
  <tr class="test" data-id="1"> <!-- Pass your table id into data-id -->
    <td>Testing</td>
    <td>Testing</td>
    <td>Testing</td>
    <td>Testing</td>
    <td>Testing</td>
  </tr>
  <tr class="test" data-id="2">
    <td>Testing1</td>
    <td>Testing1</td>
    <td>Testing1</td>
    <td>Testing1</td>
    <td>Testing1</td>
  </tr>
  <tr class="test" data-id="3">
    <td>Testing2</td>
    <td>Testing2</td>
    <td>Testing2</td>
    <td>Testing2</td>
    <td>Testing2</td>
  </tr>
</table>

弹出js对话框onclick表格行并显示php信息

3 个答案: