Окно подтверждения удаления jqGrid

Question

В настоящее время я использую jqGrid с navGrid, для del установлено значение true.Проблема в том, что когда пользователь нажимает кнопку «Удалить», в верхнем левом углу таблицы появляется окно подтверждения.Поскольку мы уже прокручиваемся до самого низа, который у меня большой высоты, пользователь должен пройти весь путь до самого верха, чтобы подтвердить.Есть ли способ изменить положение этого?Ручное смещение просто отлично, но в идеале я хочу прикрепить его к левому нижнему углу, как к верхнему левому.

Заранее спасибо

(Если это обман, извините.Я попытался просто опубликовать его, но это дало мне странную ошибку и не показывалось в моей истории, поэтому предположил, что оно не было опубликовано.)

Answer 1

Я считаю, что это не обман.Наоборот, я нахожу это хорошим, так что +1 от меня.

jqGrid внутренне использует метод viewModal ($.jgrid.viewModal), который показывает большинство диалогов.Метод имеет параметр toTop, но и delGridRow и editGridRow не используют его, и он будет установлен на toTop:true.Таким образом, диалоговые окна «Добавить», «Редактировать» и «Удалить» всегда будут отображаться в верхней части сетки, которая может находиться внутри невидимой области.

Чтобы устранить проблему, вы можете определить дескриптор события afterShowForm , которыйизменить позицию диалога.Например,

$("#list").jqGrid('navGrid','#pager', {}, {}, {},
                  {
                      afterShowForm: function($form) {
                          var dialog = $form.closest('div.ui-jqdialog'),
                              selRowId = myGrid.jqGrid('getGridParam', 'selrow'),
                              selRowCoordinates = $('#'+selRowId).offset();
                          dialog.offset(selRowCoordinates);
                      }
                  });

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

Вы можете проверитьпредлагаемое движение диалога удаления на демонстрационной версии .

Answer 2

Нашли что-то лучше здесь !

добавьте это в свою библиотеку JavaScript:

jQuery.fn.center = function () {
    this.css("position","absolute");
    this.css("top", ( $(window).height() - this.height() ) / 2+$(window).scrollTop() + "px");
    this.css("left", ( $(window).width() - this.width() ) / 2+$(window).scrollLeft() + "px");
    return this;
}

Теперь вам просто нужно добавить это в свойство afterShowForm:

afterShowForm: function(form) {
    form.closest('div.ui-jqdialog').center();
}

form.closest ('div.ui-jqdialog') => позволяет получить модальное всплывающее окно, нет необходимости уточнять, если это editForm или deleteForm.

Этот код размещает всплывающее окно в центре экрана, поэтому вам не нужно прокручивать его, если у вас действительно большая сетка.