javascript - jquery多术语列搜索

标签 javascript php jquery html

我发现了这个小代码,它的作用就像一个魅力! 演示:https://jsfiddle.net/gdv06jsu/4/

我把它放到我的项目中,现在出现了问题。 每次我进行输入时,整个表格都会消失 <th>标签。

首先它运行良好,我已经为所有列放置了搜索输入,然后 问题就在这里。现在只需要 1 个输入就无法工作?!

有人有想法吗?

这是我的代码:

   <?php
    include("dbconnect.php");
   ?>

    <html>
    <head>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
      <title>Abfrage</title>
    <script src="js-css/jquery-2.1.0.js"></script>
      <link href="https://fonts.googleapis.com/css?family=Abel" rel="stylesheet">
      <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
      <link href="https://fonts.googleapis.com/css?family=Roboto+Condensed" rel="stylesheet">
      <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.9/css/all.css" integrity="sha384-5SOiIsAziJl6AWe0HWRKTXlfcSHKmYV4RBF18PPJ173Kzn7jzMyFuTtk8JA7QQG1" crossorigin="anonymous">

      <link href="js-css/form-problem-melden.css" rel="stylesheet">





    <script type="text/javascript">
    $(window).ready(function(){

    var $filterableRows = $('#MI6').find('tr').not(':first'),
    $inputs = $('.search-key');

    $inputs.on('input', function() {

        $filterableRows.hide().filter(function() {
        return $(this).find('td').filter(function() {

          var tdText = $(this).text().toLowerCase(),
                inputValue = $('#' + $(this).data('input')).val().toLowerCase();

            return tdText.indexOf(inputValue) != -1;

        }).length == $(this).find('td').length;
      }).show();

    });

    });
    </script>

    </head>
    <body>
      <input type="text" id="problem" class="search-key" placeholder="Problem Livesuchee">
      <table id="MI6">
          <tr>
              <th>Problem</th>
              <th style="width:250px;">Meldender</th>
              <th style="width:120px;">Prio</th>
              <th style="width:102px;">Status</th>
              <th>..</th>
          </tr>


          <?php
          $ergebnis = mysqli_query($db, "SELECT * FROM wt_ticket");
          while($row = mysqli_fetch_object($ergebnis))
          {


            $akt_zeit = time();
            $offen1 = $akt_zeit - $row->timestamp;
    $offen_tage = $offen1 / 60 / 60 / 24;
    $offen_stunden = $offen1 / 60 / 60;
    $offen_minuten = $offen1 / 60;

    if($offen_tage < 1 && $offen_minuten > 60 ){
      $offen = floor($offen_stunden) . " Stunden";
    }

    if($offen_tage < 1 && $offen_stunden < 1 ){
      $offen = floor($offen_minuten) . " Minuten";
    }

    if($offen_tage >= 1){
      $offen = floor($offen_tage) . " Tage";
    }

    if($offen_tage < 1 && $offen_stunden < 1 && $offen_minuten < 1){
      $offen = $offen1 . " Sekunden";
    }

      $id = $row->id;

   ?>

  <tr>
      <td data-input="problem"><?php echo $row->problem_titel; ?> - <?php echo $row->problem; ?> - <?php echo $row->problem_spez; ?></td>
      <td><? echo $row->email; ?></td>
      <td><? echo $row->prio; ?></td>
      <td><? echo $row->erledigt_prozent; ?>
      <td>
        <a href="ticket_edit.php?id=<? echo $id; ?>" id="edit">bearbeiten <span></span><i class="fas fa-edit"></i></a>
        <a href="ticket_del.php?id=<? echo $id; ?>" id="del">löschen <span></span><i class="fas fa-trash"></i></a>
      </td>
  </tr>

  <?php
    }
  ?>

    </table>

    </body>
    </html>

最佳答案

根据 fiddle ,每个 td包含属性data-input用于获取标签的内部文本,如 <td data-input="name">James</td> 。因此,您必须指定它,因为您的代码中也会使用它 $(this).data('input')
我希望它能帮助你:)

关于javascript - jquery多术语列搜索,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49703746/

相关文章:

javascript - 在 MVC 3 中生成 Knockout 标记

jQuery UI 动画对话框显示/隐藏问题

javascript - 需要帮助编辑响应式菜单的 JavaScript 文件

jquery - jQuery UI 对话框如何禁用后台输入的焦点?

javascript - 构建页面时 promise 中断

javascript - 对 document.getElementById 的内容应用 str.search

javascript - 使用 javascript 应用属性时 CSS 属性选择器不起作用?

php - 如何在不重新安装的情况下使用 Composer 自动加载没有 namespace 的类?

php - 拉维尔 6.4 : __toString() must return a string value

php - php中的动态类属性$$value