The Scrollable Area Problem

David Burke talked today about Julia Lerman's article on scrollable areas, more specifically using a <DIV> tag to make a DataGrid scroll. It's kinda funny he mentioned that, because I'm a few days away from releasing my next killer control, which is based on a similar principle. I wasn't planning on talking about it before it was done, but since it was brought up, I decided to let the cat out of the bag a few days early.

There are a couple of problems with David/Julia's approach. First, if you just scroll the data area, the header and footer will often be out of sight. It's kind of a pain if you're dealing with A LOT of data. The other problem is that, if you have to post some information back, you lose your position in the grid. Also a pain if you're dealing with a lot of postbacks on a page.

So I decided to tackle this problem, thanks to a good friend Brian Suroweic's killer prototype. He used the Panel IE Behavior to demonstrate a scrollable DataGrid where the headers and footers are recreated outside of the scrollable area. It was a very good start, and from there, I was able to create...

 

When I started on this endeavor nearly a year ago, I had never built a server control before. Well, I take that back. I had played with a tabbed DataGrid control that I am still toying with releasing, but that is beside the point. The point is, I had never really gotten serious about building server controls. Now, having never really dived into the guts of the DataGrid control, I had assumed that my new custom control would look something like this:

Public Class ScrollingGrid
    Inherits System.Web.UI.WebControls.DataGrid

    Protected Overrides Sub Render(ByVal writer As System.Web.UI.HtmlTextWriter)
        MyBase.Header.Render(writer)
        writer.Render("<DIV>")
        MyBase.Render(writer)
        writer.Render("</DIV>")
        MyBase.Footer.Render(writer)
    End Sub

End Class

Pretty non-trivial, right? OOOH no buddy boy, I wasn't even CLOSE. By the time I was done, the control was over 500 lines. It was ridiculous. I could not believe that I had to write THAT much code to accomplish such a simple task. I had to totally rebuild each header and footer row from scratch... ugh it was maddening. But those weren't the only problems I had to deal with.

The major problem centered around what to do when the columns are autogenerated. The problem was, that with no column definition, there was no graceful way that I could access the grid display properties on the server side, because these would be completely dependent on how the client renders. Because there was no way for me to know this, I had to some up with some simple math that would calculate the number of columns, and figure some slightly adjusted percentages for the header widths. This was primarily to account for the 18px I added to the end of the last cell to account for the additional width of the scrollbar. While I had basically solved this problem, I decided that the most logical thing to do would be to urge customers to strictly define their DataGrid columns.

Oh yeah, and did I mention that we're doing some SUPER nifty things with handlers and retaining your scrollbar position on postback? It's a feature I'm calling ScrollBack Retention™, and it is handled pretty gracefully IMHO.

So, now you're probably thinking, why did it take almost a whole year to release this product? Well, if you've read my weblog, you'd know that I've been through one crazy ride. On top of that, I've come to the realization that I'm not really cut out for coding. I can do it, and I'm pretty good at it, but I'm not a code monkey like Andy Smith or Brady Gaster. I'm more of a concept guy.... I understand how .NET works and I am able to work with ideas from a conceptual standpoint. Once I realized that, I became much more effective in what I do.

But up until this point, I've been having to do basically everything myself. Paul at Xheo has done an amazing job getting me the logos and tools that I need to be successful, but everything else, from the website construction, to the marketing, branding, copy, installer, and documentation.... has been on my shoulders. GenX.NET 3.0 took 7 months to develop. It really should have taken 2. I've also had to pursue other income avenues. From more freelancing, to my Builder articles, to a stint at myKB, I've been constantly distracted by the need to feed myself.

The reason ScrollingGrid is done (besides the 2 bugs I discovered this evening) is because Interscape now has someone else finishing the code that I've started. Who is it? Well, I can't tell you yet. Believe me, I'd love to, but it's not time yet. We will say soon.

So when will we make ScrollingGrid available, and how much are we going to charge? Well, I think that this control should be used everywhere, on every site. So we're going to do something radical. We're going to give developers a license to use it on an unlimited number of websites, and you'll be able to count the number of ones you'll spend without taking off your shoes.. Are we crazy? Maybe. My bet is, that YOU'D be crazy not to buy it.

So that's how we tackled the scrollable area problem. You'll get to try it for yourself on Monday.

9 Comments

Comments have been disabled for this content.