is there a way to positioning the dialog message "Please select row" in the corner left top of the selected grid?
I just want the same behavior in alert warning, just like the edit and delete form..
This topic solution dont work for me..
JQGrid position of the AlertMod warning message
i have 3 grids in same page and if you click in one row of last grid, the message of warning appears in top of the page and its not perceptible for the user...
can anyone help me?
thanks in advance
Solution:
var orgViewModal = $.jgrid.viewModal;
$.extend($.jgrid, {
viewModal: function (selector, o) {
if (selector === '#alertmod') {
var $gbox = $(o.gbox), $selector = $(selector);
var of = $gbox.offset(), w = $gbox.width(), h = $gbox.height();
var w1 = $selector.width(), h1 = $selector.height();
$selector.css({
'top': of.top + ((h-h1)/2),
'left': of.left + ((w-w1)/2)
});
}
orgViewModal.call(this, selector, o);
}
});
To other interested persons, this solution works for me. Only changes the position of the alert box and keep everything else equal.
If I understand correct your question you can use alerttop
and alertleft
options of navGrid. The parameters could be included in parameters
option of navGrid
. The answer describes one more non-documented options of navGrid
.
look at this answer
http://www.ok-soft-gmbh.com/jqGrid/CenterEditForm.htm
you need to change your beforeShowForm event
or you can implement this function on afterShowform event
function centerForm ($form) {
$form.closest('div.ui-jqdialog').position({
my: "center",
of: $('#grid').closest('div.ui-jqgrid')
});
}
As I wrote upper in a comment I have a long table and I need alert window always to be at the center of viewport.
So I need dynamic positioning of the alert window.
I need to set position after user scroll page down and click "edit" or "delete".
As I understand Nav does not have events like "beforeShowForm" or "beforeShowSearch" for the alert modal window.
Also I can't catch clicks on the pager.
Solution provided by Oleg and Paulo Pinto does not work for me. I don't know why.
I even don't understand how it works :)
So I found my own straight and ... not nice way.
loadComplete: function(){
$(window).scroll(function() {
$('#alert_window_id').center();
});
}
where "center()" is
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;
}
After loadComplete the alert div seems already exist and grid has its full height so window scroll exists too.
Because I have no events of clicking "edit" button or alert dialog shown - i am repositioning alert dialog after every scroll event.