Как настроить сортировку в KendoGrid UI Jquery? - PullRequest
0 голосов
/ 04 марта 2020

Ввод данных в сетку кендо:
яблоко, летучая мышь, кошка, собака, яйцо, веер

Пользователь ввел 'egg' в текстовое поле, тогда вывод в кендогрид должен выглядеть следующим образом , «яйцо» должно быть самой верхней строкой, а все остальные имена должны отображаться в алфавитном порядке.

    Name
   ==================
    "egg" 
    "apple" 
    "bat" 
    "cat" 
    "dog" 
    "fan"

Вот код

<div id="grid"></div>
<input type="textbox" text="egg"/>
<script>

  $("#grid").kendoGrid({ dataSource: { data : [ { id: 1, name: "apple" }, { id: 2, name: "bat" }, { 
        id: 3, name: "cat" }, { id: 4, name: "dog" }, { id: 5, name: "egg" }, { id: 6, name: "fan" } ], 
       pageSize: 10, schema : { model: { fields: { id : { type: 'number' }, name: { type: 'string' } } } 
      } 
    }, editable : false, pageable : false, sortable : true, columns : [ { field: "id", title: "Number" }, 
     { field : "name", title : "Name", sortable: { compare: function (a, b) { return a.name == "e" ? "e" 
          :0 ; } } } ] }).data("kendoGrid");
</script>   

Может кто-нибудь ответить на вышеуказанный вопрос

1 Ответ

0 голосов
/ 04 марта 2020

Сортировка сетки по умолчанию осуществляется щелчком по заголовку столбца. Я предполагаю, что вы хотите реализовать какую-то пользовательскую сортировку, которая зависит от пользовательского ввода.

Вы можете настроить логи сортировки c, передав обработчик compare объекту сортировки.

например,

      var numbers = {
        "one"  : 1,
        "two"  : 2,
        "three": 3,
        "four" : 4,
      };

      var dataSource = new kendo.data.DataSource({
        data: [
          { id: 1, item: "two" },
          { id: 2, item: "one" },
          { id: 3, item: "three" },
          { id: 4, item: "four" }
        ]
      });

      dataSource.sort({ field: "item", dir: "asc", compare: function(a, b) {
        			return numbers[a.item] - numbers[b.item];
            }
       })

В вашем случае вместо использования объекта numbers в обработчике сравнения просто используйте ввод пользователя.

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