Question

我有一个HTML表，该表具有从数据库中检索到的行。

使用tbody标签隐藏了一些行以模态形式显示它们，并在必要时进行一些编辑。该模式可以完美地与数据库中的编辑一起工作，除了那些本应显示用于编辑的数据之外，所有其他信息也都隐藏了！

该如何解决？

这是我的带有隐藏行代码的表，它们位于while语句中：

<tbody style="display:none">
<td data-target="FLOOR"><?php echo $row['FLOOR'];?></td>
<td data-target="ORDER_OFFICE"><?php echo $row['ORDER_OFFICE'];?></td>
<td data-target="SERIAL_NO"><?php echo $row['SERIAL_NO'];?></td>
<td data-target="POINT_NO"><?php echo $row['POINT_NO'];?></td>
<td data-target="NOTE"><?php echo $row['NOTE'];?></td>
<td data-target="OTHER_NAME"><?php echo $row['OTHER_NAME'];?></td>
<td data-target="ORDER_TELE"><?php echo $row['ORDER_TELE'];?></td>
</tbody>



 <script>  

    //  append values in input fields
      $(document).on('click','a[data-role=update]',function(){
            var id  = $(this).data('id');
            var FLOOR  = $('#'+id).children('td[data-target=FLOOR]').text();
            var ORDER_OFFICE  = $('#'+id).children('td[data-target=ORDER_OFFICE]').text();
            var SERIAL_NO  = $('#'+id).children('td[data-target=SERIAL_NO]').text();
            var POINT_NO  = $('#'+id).children('td[data-target=POINT_NO]').text();
            var NOTE  = $('#'+id).children('td[data-target=NOTE]').text();
            var OTHER_NAME  = $('#'+id).children('td[data-target=OTHER_NAME]').text();
            var ORDER_TELE  = $('#'+id).children('td[data-target=ORDER_TELE]').text();

            $('#FLOOR').val(FLOOR);
            $('#ORDER_OFFICE').val(ORDER_OFFICE);
            $('#SERIAL_NO').val(SERIAL_NO);
            $('#POINT_NO').val(POINT_NO);
            $('#NOTE').val(NOTE);
            $('#OTHER_NAME').val(OTHER_NAME);
            $('#ORDER_TELE').val(ORDER_TELE);
            $('#userId').val(id);
            $('#myModal3').modal({backdrop: "static"});
      });
       // now create event to get data from fields and update in database 

       $('#save').click(function(){
          var ID = $('#userId').val(); 
         var FLOOR =  $('#FLOOR').val();
          var ORDER_OFFICE =  $('#ORDER_OFFICE').val();
          var SERIAL_NO = $('#SERIAL_NO').val();
          var POINT_NO = $('#POINT_NO').val();
          var NOTE = $('#NOTE').val();
          var OTHER_NAME = $('#OTHER_NAME').val();
          var ORDER_TELE = $('#ORDER_TELE').val();

          $.ajax({
              url      : 'edit_order.php',
              method   : 'post', 
              data     : {FLOOR : FLOOR, ORDER_OFFICE : ORDER_OFFICE, SERIAL_NO : SERIAL_NO, POINT_NO : POINT_NO 
                        ,NOTE : NOTE, OTHER_NAME : OTHER_NAME, ORDER_TELE: ORDER_TELE, ID: ID},
              success  : function(response){
                            // now update user record in table 
                             $('#'+id).children('td[data-target=FLOOR]').text(FLOOR);
                             $('#'+id).children('td[data-target=ORDER_OFFICE]').text(ORDER_OFFICE);
                             $('#'+id).children('td[data-target=SERIAL_NO]').text(SERIAL_NO);
                             $('#'+id).children('td[data-target=POINT_NO]').text(POINT_NO);
                             $('#'+id).children('td[data-target=NOTE]').text(NOTE);
                             $('#'+id).children('td[data-target=OTHER_NAME]').text(OTHER_NAME);
                             $('#'+id).children('td[data-target=ORDER_TELE]').text(ORDER_TELE);
                             $('#myModal3').modal('toggle'); 

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

谢谢。

Answer 1

如果要显示此表以供编辑，只需在呈现页面后使用JavaScript从tbody标记中删除style="display:none"，或者等待条件变为 true 。如果要有条件地更改样式，建议不要直接在标记内部使用样式。您可以使用javascript来做到这一点。

或者在PHP端进行渲染时，您可以检查是否隐藏。

<tbody style="<?php echo $ifConditionTrue ? "display:none" : "";?>">'

或者是短途

<tbody style="<?= $ifConditionTrue ? "display:none" : "";?>">'

传递给模式时显示php隐藏行

1 个答案: