Tag Archives: browser

Reenable (temporary) showModalDialog support in Chrome (for Windows) 37+

You know you shouldn’t use showModalDialog to open modal windows – it’s bad taste and prone to cause issues. Unfortunately many applications (especially Enterprise ones) rely on the method ability to halt code execution until the window closed (e.g. user answers a YES/NO question).

Tough luck, starting version 37 Google Chrome removed support for showModalDialog. Your code suddenly began to act in weird and unpredictable way. You definitely should rework it to use a different approach to dialogs. Fortunately Google gives you a bit more time. You can re-enable showModalDialog support, but only temporarily – until May of 2015. Continue reading →

Display “Lose It!” data on Pebble watchface

Original Lose It!Lose It! on Pebble

Lose It! is an excellent service that helps people lose weight by monitoring calories intake. It integrates with variety of devices so I was curious if I can display my user data on Pebble smartwatch (to make sure I can have another piece of cake or not).

Unfortunately LoseIt doesn’t have a public API. There had to be another way. Continue reading →

WebDataGrid: Prevent scrolling on row selection

If you working with Infragistics Aikido controls and your WebDataGrid or WHDG is too long – a common approach to make content scrollable is to place grid control inside of a DIV with fixed dimensions and overflow set to auto:

WHDG scrollable inside of parent DIV

It works fine, but there’s one drawback: if you scroll your grid horizontally and then select a row – grid’s scroll position snaps back to the leftmost position. Infragistics says that it’s a browser bug and we need to talk to browser vendor about it. Wanting to solve the problem in this century I looked for alternatives and this is what I found. Continue reading →

ClientScript.RegisterStartupScript: script injected, but not executed

This was one weird mystery. I have used ASP.NET’s method ClientScript.RegisterStartupScript countless times to inject client-side JavaScript into page’s markup from the server-side code and it always worked perfectly. This time I created a very basic page from scratch:

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>My Page</title>
    <script type="text/javascript" src="script1.js" />
    <script type="text/javascript" src="script2.js" />
    <script type="text/javascript" src="script3.js" />
</head>
<body>
    <form id="xfrmMain" runat="server">
    </form>
</body>
</html>

And then injected client-side script into it:

ClientScript.RegisterStartupScript(Me.GetType, "JSCode", "ProcessData();", True)

where ProcessData() is function from one of the scripts, loaded in the HEAD tag. The script injected just fine, I got a beautiful insert at the bottom of the rendered page:

<script type="text/javascript">
//<![CDATA[
ProcessData();//]]>
</script>

The problem was – it didn’d do squat – the script did not execute. Why? Continue reading →

Solution for UltraWebGrid missing scrollbars

I was working with classic Infragistics UltraWebGrid when noticed strange thing – even though scrollbars were enabled for the grid, the grid had fixed size and number of rows was bigger than the grid could display – no scrollbars appeared. For me it was a combination of grid being shown in a modal dialog in IE7 browser, but it could happen in other scenarios.

I also noticed when grid experienced any kind of user interaction (row added, row selected, checkbox cell checked etc.) scrollbars would magically appear. So the solution? Simulate user interaction. For example this code can be included in grid’s client-side InitializeLayout event:

function xMyGrid_InitializeLayout() {
    var oGrid = igtbl_getGridById('xMyGrid')
    oGrid.Rows.getRow(0).setSelected(true);
    oGrid.Rows.getRow(0).setSelected(false);
}

What happens here is first row of the grid is selected and an instant later unselected. It happens so fast that there’s no visual indication. But the grid gets its “user interaction” and scrollbars appear.

Microsoft with the sense of humor

Visited IE test-drive site in my Chrome browser today and was greeted with a cheery banner:

Microosft about Chrome

I guess that “Don’t forget to enable your partial hardware acceleration in the about:flags thingy…” is a veiled reference that IE9’s HTML5 is fully “hardware accelerated”. Still funny.

Update: Since Microsoft is abandoning their “native HTML5” party line the funny logo has been removed as well. Too bad, especially after comparing FPS on speed tests.

Making HoverCssClass work in WebDataTree

Infragistics WebDataTree control offers extensive support of CSS for tree styling. One of the options HoverCssClass is intended to alter tree node appearance when mouse pointer hovers over it:

HoverCssClass properting in Infragistics WebDataTree

Unfortunately it doesn’t seem to have any effect on the tree appearance. When I set that class to simple underline node:

.fnTreeHover {text-decoration:underline}

nothing happened. I found the workaround when I noticed that the tree is rendered as an ancor tag <A> inside of <LI> tag:

WebDataGrid rendered in HTML

The solution is to apply style to this combination:

LI A:hover {text-decoration:underline}

Bingo. Now tree nodes are underlying when mouse is over them.

Infragistics WebDataMenu CSOM addItem/removeItem workaround

Infragistics Aikido WebDataMenu control has extensive (albeit poorly documented) client-side library of classes, method and properties. 2 methods addItem and removeItem supposedly allow you to add/remove menu items in JavaScript. These methods have been public since 9.2 release probably even earlier, but have a lot of drawbacks, one of the major ones – for every method call an AJAX call to server is made, which slows performance dramatically, breaks code flow and won’t let you set properties of newly added item.

Method described below is a bit of a hack, but it works purely client-side, no slow round trips, no waiting for AJAX call to return and you have full control of all menu items. Continue reading →

LightGray in IE6

IE6 just won’t die. I know, continue to support it is a bad idea, but unfortunately many developers have no choice, some environments, especially corporate intranet will continue to use it until second coming (and then Safari will rule the world).

So, here is a small tip: If you need to use a named color from CSS3+ specification that old tired browser doesn’t understand – just use color’s hex equivalent instead. For example instead of

style="border: solid 1px LightGray;"

which will do nothing in IE6 use

style="border: solid 1px #d3d3d3;"

which will render nice light-gray border.

UltraWebGrid does not display last column’s right border (solution)

If you’re using Infragistics UltraWebGrid and experienced an odd behavior where the grid does not display the right-most vertical border line – there’s a workaround.

By default 2 elements contribute to the grid border – border from RowStyleDefault property and border from FrameStyle property. For some reason IE6/7 (yes, some people still use those) do not render the right border of the last column, even though all 3 properties (BorderColor, BorderStyle and BorderWidth) are set. So the solution is to have FrameStyle lend that border:

  1. Expand RowStyleDefault -> BorderDetails property and set StyleRight to None – this is done, so the double border won’t render in IE8 and other browsers where the border is displayed correctly in the first place
  2. Expand FrameStyle -> BorderDetails property and set ColorRight, StyleRight and WidthRight properties to the desired color, style and width (e.g. LightGray, Solid, 1px)

As a result, the right border is displayed correctly in all versions of IE.