jqGrid 4.1.0 issue with icon hover when inline edit

In previous version when inline editing all looking good:

But in new version it is lo开发者_如何学Pythonoking like that (i put read border over):

How to fix that?

I am using jQuery 1.6.1, jQueryUI 1.8.13

I also have using the latest jqGrid css file

The reason seems to me the wrong hover effects included in the jqGrid 4.1.0 on the <span> element with the save and cancel icons:

onmouseover=jQuery(this).addClass('ui-state-hover');
onmouseout=jQuery(this).removeClass('ui-state-hover');

see the source code of jquery.fmatter.js.

If I correct understand the problem the adding of 'ui-state-hover' class overwrites the background-position to 50% 50%, so the icons for the disk (ui-icon-disk) or the cancel icon (ui-icon-cancel) will not more displayed. Instead of that the middle of the background image are displayed.

So I suggest just remove the hover effects inside of loadComplete:

loadComplete: function() {
    $("div.ui-inline-save > span.ui-icon-disk, div.ui-inline-cancel > span.ui-icon-cancel").each(function() {
        this.onmouseover = null;
        this.onmouseout = null;
    });
}

See the demo.

UPDATED:: I found a better way to fix the problem. First we can defive the functions iconHoverFixed and iconNotHoverFixed as following

var iconHoverFixed = function(e) {
        jQuery(this).addClass('ui-state-hover');
        jQuery('span',this).removeClass('ui-state-hover');
    },
    iconNotHoverFixed = function(e) {
        jQuery(this).removeClass('ui-state-hover');
    };

and then we can fix the hovering problem so:

loadComplete: function() {
    $("div.ui-inline-save, div.ui-inline-cancel").each(function() {
        this.onmouseover = iconHoverFixed;
        this.onmouseout = iconNotHoverFixed;
    });
}

See the new demo here or here.

Looks like you need to update the jquerygrid css and the images folder the image is build from an offset inside an image (Sprite) http://www.trirand.com/blog/jqgrid/themes/redmond/images/ui-icons_6da8d5_256x240.png and in you case it doesn't find the right place