jQuery .tablesorter.addParser - это использование функции - PullRequest
1 голос
/ 06 апреля 2020

Нет четкой информации о том, как использовать is: function(s, table, cell, $cell) {}, как я намереваюсь использовать, однако я не получил осознанных знаний из документального фильма.

У меня есть блок кода, как показано ниже. Назначение функции - заполнить массив данными столбца, после чего в текстовом сортировщике использовать его для сортировки данных массива. однако, когда я нажимаю на второй столбец, столбец, который использует addparser, больше не сортируется должным образом. Так что это связано с функцией addParser, поэтому я подумал, что могу исправить это, используя функцию.

jQuery.tablesorter.addParser({
                        id: "parser",
                        is: function(s, table, cell, $cell) {
                            console.log("s",s,"table", table,"cell", cell, "$cell",$cell)
                            // s is the text from the cell
                            // table is the current table (as a DOM element; not jQuery object)
                            // cell is the current table cell (DOM element)
                            // $cell is the current table cell (jQuery object; added v2.18.0)
                            // return false if you don't want this parser to be auto detected
                            return true;
                        },
                        parsed: true,
                        format: function(aStr) {
                            console.log("aStr", aStr)

                            if (aStr.includes(".")) {
                            array_.push(aStr);

                            } else if (aStr.includes("-")) {
                            var result2 = aStr.replace(/-/g, ".");
                            console.log("before reverse array", result2)
                            result2 = result2.split(".");
                            result2 = result2.reverse();
                            result2 = result2.join(".");
                            console.log("reversed array", result2)
                            array_.push(result2);

                            } else {
                            array_.push(aStr);
                            }

                            return array_;
                        },
                        type: "text"
                });
, headers : {
                    1: {
                        sorter: "parser"
                    },
          }
, textSorter : {

                        1:  function(aStr, bStr) {
                            <cfif isdefined("attributes.id") and attributes.id eq 0.1>
                                var value = "";
                                var previousValue = "";
                                console.log("array_",array_);

                                 for (var i = 0; i < array_.length; i++) {
                                    value = array_[i];
                                    previousValue = array_[i-1];
                                    // console.log("value",value, "previousValue", previousValue);

                                 }

                                 return value > previousValue ? 1 : value < previousValue ? -1 : 0;
                            </cfif>
                             },
          }
Sample data: 
var arr = [
   "1",
   "1",
  "1.1.1",
  "1.1.1.1",
  "1.1.1.2",
  "1.1.2",
  "1.1.3",
  "1.1.4",
  "1.1.5",
  "1.1.6",
  "1.1.7",
  "1.1.7.1",
  "1.1.7.2",
  "1.1.7.3",
  "1.1.8",
  "1.1.8.1",
  "1.1.9",
  "1.1.10",
  "1.1.11",
  "1.1.11.1",
  "1.1.11.2",
  "1.1.11.3",
  "1.1.11.4",
  "1.1.11.5",
  "1.1.11.6",
  "1.1.11.7",
  "1.1.11.8",
  "1.1.11.9",
  "1.1.12",
  "1.1.13",
  "1.1.13.1",
  "1.1.13.2",
  "1.1.13.3",
  "1.1.14",
  "1.1.15",
  "1.1.15.1",
  "1.1.15.2",

  "1.2",
  "1.2.1",
  "1.2.2",
  "1.2.3",
  "1.2.3.1",
  "1.2.3.2",
  "1.2.3.3",
  "1.2.3.4",
  "1.2.3.5",
  "1.2.3.6",
  "1.2.3.7",
  "1.2.4",
  "1.2.5",
  "1.2.6",
  "1.2.7",
  "1.3.1",
  "1.3.2",
  "2",
  "2.1",
  "1.3"
 ]

1 Ответ

1 голос
/ 07 апреля 2020

Функция и параметры is описаны на этой странице: https://mottie.github.io/tablesorter/docs/example-parsers.html

По сути, он используется только для автоматического обнаружения, если парсер должен использоваться по заданным параметрам. c столбец.

  • Если вы хотите, чтобы он автоматически определялся, то только возвращает true, если строка ячейки (s), свойство ячейки или атрибут соответствуют ваши критерии.
  • Если вы уже знаете, какие данные в вашей таблице, в частности, какие столбцы вы хотите иметь пользовательский анализатор, то установите для функции is значение всегда return false ; затем установите заголовок (th в thead) имени класса на sorter-{parser.id} (см. https://mottie.github.io/tablesorter/docs/example-option-built-in-parsers.html)

В приведенном выше примере кода я угадаете, вы сортируете IPv4-адреса? Проверьте https://mottie.github.io/tablesorter/docs/example-parsers-ip-address.html - сам синтаксический анализатор должен работать с любой длиной значений, разделенных десятичной запятой, например, 1.2.3.4.5.6.7.99


Обновление: я забыл, что парсер "ipAddress" не работает не работает должным образом, если количество разделов не соответствует; например, это будет работать, если все ячейки в столбце имеют 4 раздела «1.1.1.1» (числа, разделенные десятичными точками)

Вот модифицированная версия, которая будет сортироваться, как вы ожидаете - demo

 var maxSections = 4; // e.g. "1.1.1.1" = 4; "1.1.1.1.1" = 5
 var maxCharsPerSection = 3; // e.g. "1.1.1.999" = 3; "1.1.1.9999" = 4

 // Don't modify anything below
 var filler = new Array(maxCharsPerSection).fill('0').join('');

 $.tablesorter.addParser({
   id: 'decimal-separated',
   is: function() {
     return false;
   },
   format: function(s) {
     var i = 0,
       a = s ? s.split('.') : [],
       r = [];
     for (i = 0; i < maxSections; i++) {
       r.push((filler + (a[i] || '0')).slice(-maxCharsPerSection));
     }
     return s ? r.join('.') : s;
   },
   type: 'text'
 });


 $(".big_list").tablesorter({
   sortList: [
     [0, 0]
   ],
   headers: {
     0: {
       sorter: 'decimal-separated'
     }
   }
 });
...