JQuery Datatable поиск столбцов - как исключить 0,00? - PullRequest
Новая
       2

JQuery Datatable поиск столбцов - как исключить 0,00?

0 голосов
/ 12 октября 2018

Я использую плагин jQuery DataTables (http://datatables.net) для разбивки на страницы, возможностей поиска и фильтрации.

Здесь мне нужно отобразить Pecent и Зарплата строк, которые не содержат 0,00. Я попробовал приведенное ниже регулярное выражение, но не работает.

'^ / [+ -]? ((\ 0 +.? \ 0 *) | (. \ 0+)) $ '

Пожалуйста, помогите мне добиться этого.

demo_link

HTML-код : 

$(document).ready( function () {
  var table = $('#example').DataTable();
  
  // Filter out rows which do not contain a plus sign
  table.search( '^/[+-]?((\0+\.?\0*)|(\.\0+))$ ', true, false ).draw();
} );
body {
  font: 90%/1.45em "Helvetica Neue", HelveticaNeue, Verdana, Arial, Helvetica, sans-serif;
  margin: 0;
  padding: 0;
  color: #333;
  background-color: #fff;
}
<!DOCTYPE html>
<html>
  <head>
    <script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>

    <link href="//datatables.net/download/build/nightly/jquery.dataTables.css" rel="stylesheet" type="text/css" />
    <script src="//datatables.net/download/build/nightly/jquery.dataTables.js"></script>

    <meta charset=utf-8 />
    <title>DataTables - JS Bin</title>
  </head>
  <body>
    <div class="container">
      <table id="example" class="display" width="100%">
        <thead>
          <tr>
            <th>Name</th>
            <th>Pecent</th>
            <th>Position</th>
            <th>Office</th>
            <th>Age</th>
            <th>Start date</th>
            <th>Salary</th>
          </tr>
        </thead>

        <tfoot>
          <tr>
            <th>Name</th>
            <th>Pecent</th>
            <th>Position</th>
            <th>Office</th>
            <th>Age</th>
            <th>Start date</th>
            <th>Salary</th>
          </tr>
        </tfoot>

        <tbody>
          <tr>
            <td>Non Zero row</td>
            <td>0.00</td>
            <td>System + Architect</td>
            <td>Edinburgh</td>
            <td>61</td>
            <td>1222</td>
            <td>3.12</td>
          </tr>
          <tr>
            <td>Zero row 1</td>
            <td>12.00</td>
            <td>Director</td>
            <td>Edinburgh</td>
            <td>63</td>
            <td>2011/07/25</td>
            <td>0.00</td>
          </tr>
          <tr>
            <td>Zero row 2</td>
            <td>13.43</td>
            <td>Test</td>
            <td>India</td>
            <td>53</td>
            <td>2011/07/25</td>
            <td>0.00</td>
          </tr>
        </tbody>
      </table>
    </div>
  </body>
</html>

1 Ответ

0 голосов
/ 12 октября 2018

Если вы просто хотите удалить строки с «0,00» в последней ячейке, вы можете удалить эти строки с помощью стандартных методов jQuery перед созданием таблицы данных.

Вы можете добавить дополнительную логику, конечно же, изменив селектор в .find (), если вы изменит строки с "Pecent" ИЛИ "Salary", равным "0,00", ваша таблица примера будет пустой, поэтому я просто проверяюдля последней ячейки здесь: 

$(function() {

  $('#example')
    .find("tbody td:last-child")
    .filter(function(idx, el) {
      return $(el).text() === "0.00"
    })
    .closest("tr")
    .detach();

  $('#example').DataTable();
  
});
body {
  font: 90%/1.45em "Helvetica Neue", HelveticaNeue, Verdana, Arial, Helvetica, sans-serif;
  margin: 0;
  padding: 0;
  color: #333;
  background-color: #fff;
}
<!DOCTYPE html>
<html>

<head>
  <script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>

  <link href="//datatables.net/download/build/nightly/jquery.dataTables.css" rel="stylesheet" type="text/css" />
  <script src="//datatables.net/download/build/nightly/jquery.dataTables.js"></script>

  <meta charset=utf-8 />
  <title>DataTables - JS Bin</title>
</head>

<body>
  <div class="container">
    <table id="example" class="display" width="100%">
      <thead>
        <tr>
          <th>Name</th>
          <th>Pecent</th>
          <th>Position</th>
          <th>Office</th>
          <th>Age</th>
          <th>Start date</th>
          <th>Salary</th>
        </tr>
      </thead>

      <tfoot>
        <tr>
          <th>Name</th>
          <th>Pecent</th>
          <th>Position</th>
          <th>Office</th>
          <th>Age</th>
          <th>Start date</th>
          <th>Salary</th>
        </tr>
      </tfoot>

      <tbody>
        <tr>
          <td>Non Zero row</td>
          <td>0.00</td>
          <td>System + Architect</td>
          <td>Edinburgh</td>
          <td>61</td>
          <td>1222</td>
          <td>3.12</td>
        </tr>
        <tr>
          <td>Zero row 1</td>
          <td>12.00</td>
          <td>Director</td>
          <td>Edinburgh</td>
          <td>63</td>
          <td>2011/07/25</td>
          <td>0.00</td>
        </tr>
        <tr>
          <td>Zero row 2</td>
          <td>13.43</td>
          <td>Test</td>
          <td>India</td>
          <td>53</td>
          <td>2011/07/25</td>
          <td>0.00</td>
        </tr>
      </tbody>
    </table>
  </div>
</body>

</html>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...