jqgrid изменить курсор при сортировке - PullRequest
0 голосов
/ 02 июля 2018

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

Для этого я попытался изменить свойство CSS cursor в событии onSortCol:

onSortCol: function (index, iCol, sortorder) {
    $("body, .ui-jqgrid .ui-th-column > div.ui-jqgrid-sortable").css({'cursor' : 'wait'});
}

и изменил его обратно в событии loadComplete:

loadComplete: function () {
     $("body").css({'cursor' : 'default'});
     $(".ui-jqgrid .ui-th-column > div.ui-jqgrid-sortable").css({'cursor' : 'pointer'});
}

Но это не работает. Похоже, что браузер не отображает курсор до выполнения сортировки.

Есть идеи, как поступить?

1 Ответ

0 голосов
/ 02 июля 2018

Я закончил с этим решением:

  1. Найдите в библиотеке jqGrid, где был вызов, который начал сортировку
  2. Изменить курсор перед этим вызовом
  3. Установите тайм-аут, чтобы дать браузеру время учесть изменения
  4. Запустить сортировку
  5. Восстановить курсор

Это делается в jquery.jqgrid.src.js (версия 4.15.4) в строке 5729:

if (iColByName != null) {
    // the $("div", this)[0].id looks like "jqgh_" + p.id + "_" + colIndex (like "jqgh_list_invdate")
    sortData.call(ts, $("div", this)[0].id.substring(5 + p.id.length + 1), iColByName, r, d, this, e);
}

Я заменил на:

if (iColByName != null) {
    // the $("div", this)[0].id looks like "jqgh_" + p.id + "_" + colIndex (like "jqgh_list_invdate")
    $("body").addClass('waiting');
    setTimeout(() => {
        sortData.call(ts, $("div", this)[0].id.substring(5 + p.id.length + 1), iColByName, r, d, this, e);
        $("body").removeClass('waiting');
    }, 50);
}

Здесь CSS-класс waiting взят здесь: https://stackoverflow.com/a/25207986/8790102

body.waiting * {
    cursor: progress;
}
...