Fix: jqGrid search operator menu items jumping around on hover

A colleague noticed earlier on today, that on the Chrome browser they were using, the search operator menu items of a jqGrid on a web app’s UI were jumping around on hover, making it practically impossible to select one.

  

Seems this had started occurring on that ASP.net MVC web application, after a recent update to the latest jQuery-UI NuGet package.

Probably the issue wouldn’t occur if it wasn’t using the older free version of jqGrid. Will probably transition it eventually to free-jqGrid, the free fork (and quite evolved since forked) of the older free version of jqGrid, since jqGrid’s newer version is now commercial.

For the time being, I ended up adding this fix to Content/Site.css of the ASP.net MVC webapp:

/* jqGrid search operator menu item hover (uses jQuey-UI) */

a.ui-corner-all.g-menu-item.ui-state-hover {
    border: 1px #cccccc !important; /* fix for Chrome: removed "solid" (was causing hovered items to resize and menu to relayout, making it too hard to select them */
    /*border: 1px solid #cccccc;*/ /* this is used by jQuery-UI for .ui-state-hover */

    color: blue; /* showing blue color for hovered over menu text, should show better than a hover border since selected item already has a border itself */
}

This also has the added extra that on hover it shows the hovered item’s text in blue:

HowTo: Quickly test a webpage in different Internet Explorer versions

I just noticed that on Internet Explorer 11 developer tools console (appears when you press F12 key), there is a drop-down where you can select the rendering engine used. Edge means the very latest (IE11 one in this case) and you can select back to version 5.

Interestingly, there is no version 6 in the dropdown, don’t remember if there was an IE6 or if they jumped from IE5.5 or something to IE7 directly.

HowTo: find max ZIndex from a collection of UIElements with LINQ

Based on a relevant answer at

http://stackoverflow.com/questions/1101841/linq-how-to-perform-max-on-a-property-of-all-objects-in-a-collection-and-ret

and some digging into LINQ’s Aggregate method documentation is what I’ve just added to my enhanced version of SilverFlow library’s FloatingWindowHost (copying from FloatingWindowHost.cs at http://clipflair.codeplex.com source code)

        /// <summary>
        /// Sets the specified UIElement topmost.
        /// </summary>
        /// <param name="element">UIElement to set topmost.</param>
        /// <exception cref="ArgumentNullException">UIElement is null</exception>
        private void SetTopmost(UIElement element)
        {
            if (element == null)
                throw new ArgumentNullException("element");

            Canvas.SetZIndex(element, MaxZIndex + 1);
        }

        public int MaxZIndex
        {
          get {
            return FloatingWindows.Aggregate(-1, (maxZIndex, window) => {
              int w = Canvas.GetZIndex(window);
              return (w > maxZIndex) ? w : maxZIndex; 
            });  //Math.Max would be cleaner, but slower to call
          }
        }

Worth noting regarding the code above is that Canvas.ZIndex is an attached property available for UIElements in various containers, not just used when being hosted in a Canvas (see http://stackoverflow.com/questions/569751/controlling-rendering-order-zorder-in-silverlight-without-using-the-canvas-con)

Guess one could even make a SetTopmost and SetBottomMost static extension method for UIElement easily by adapting this code.

Suggestion: triple-click to select row in InputBox/TextBox and paragraph in RichTextBox

In upcoming Internet Explorer version (IE9), one can triple click text in a webpage to select a whole paragraph (vs double-clicking that already existed to select a whole word) of text. A really useful feature I believe (if coupled with an accelerator to send selected content to social networks it would be even nicer)

I’d suggested this feature is added to Windows native UI controls too (and hope this would eventually be implemented in Java and .NET WinForms and WPF controls too). It would be very useful to have in single-line InputBox / TextField (instead of having to press CTRL+A) but especially in multi-line ones like the classic TextBox (where it would select current text row) or the RichTextBox (RTF-enabled) one (where it would select current paragraph as in IE9).