“Imagination is more important than knowledge. For while knowledge defines all we currently know and understand, imagination points to all we might yet discover and create.” - Albert Einstein


I am pleased to announce that CoolGridView control for ASP.NET 2.0 now allows user-resizable columns and it remembers the current scroll position and column widths after a postback or callback.

You can download the latest release at Codeplex.com. Here are the following changes in this release (Build 20100124). Please take note that item #1 and #2 and breaking changes. If you are going to replace your CoolGridView from old releases with this new one, please modify your code according to the instructions provided.

  1. CoolCore.js and CoolCore.cs were added to IdeaSparx.CoolControls.Web project.
  2. If you are using CoolGridView inside an UpdatePanel, the add-on script is not needed anymore. You should remove the JavaScript code (as shown here) from your ASPX page. This functionality is now fully integrated in the CoolGridView control.
    //Remove this JavaScript from your ASPX
    function AjaxEndRequestHandler(sender, args) {
        var p = sender._updatePanelClientIDs;
        if (p != null)
        for (var j = 0; j < p.length; j++) {
            var scripts = $get(p[j]).getElementsByTagName("script");
            // .text is necessary for IE.
            for (var i = 0; i < scripts.length; i++) {
                try {
                    eval(scripts[i].innerHTML || scripts[i].text);
                } catch (e2) { }
            }
        }
    }
    
    try {Sys.WebForms.PageRequestManager.getInstance() .add_endRequest(AjaxEndRequestHandler);
    }catch (e) { }
    
  3. User can resize column headers' width.
  4. Column header and scroll position are preserved after a postback or callback.
What a great way to start the week!

Have a great Monday everyone.

Labels: , , , , , , , , , , , , ,

 Subscribe to feed

Data Bind CoolGridView to IQueryable<>

I recently received a question about how to data bind CoolGridView to an object of type IQueryable<> with automatic sorting and paging. CoolGridView extends ASP.NET GridView control. GridView does not directly support DataSource of type IQueryable<>, and the same is true for CoolGridView. We can use LinqDataSource control to bridge the gap. Quickly bind CoolGridView control to IQueryable<> with automatic sorting and paging capability by following these easy steps.

  1. Drop a CoolGridView and a LinqDataSource control into your ASPX page.
  2. In the "Properties" toolbox, set the DataSourceID of CoolGridView to point to your LinqDataSource control. Set the properties of CoolGridView control to the following:
    • AllowPaging : True
    • AllowSorting : True
  3. Handle the "Selecting" event of LinqDataSource
  4. In the "Selecting" event handler, call your method that returns an IQueryable<> object and assign it to the event argument's property "e.Result".
There you have it!

Have a great weekend everyone.

Labels: , , , , ,

 Subscribe to feed

Down Memory Lane - How this idea sparked


Four months back I started this blog and my open-source project - IdeaSparx CoolControls. I am a fan of ASP.NET 2.0 GridView. In my opinion it is simple yet flexible, plain yet lightweight, unsophisticated yet powerful. GridView control is well designed that it is easy to customize and extend. Not only that, it is also possible to extend GridView so that it can nearly match any popular and commercially available third-party controls out there. The only thing, of course, is that it requires a lot of work. But the huge amount of "sweat" i put into this is all worth it. I have this monumental dream which I planned out in my head that someday, somewhere, somehow (haha, now i am being a bit melodramatic..)  the ASP.NET community will have an open-source alternative over the commercially available grid controls. Therefore, I named this dream project - IdeaSparx CoolControls.

All About IdeaSparx CoolControls

One of its controls is CoolGridView which extends ASP.NET 2.0 GridView. At the end of 2009, CoolGridView was able to render GridView with fixed header, footer or pager and scrollable content. Now think about these features - resizable columns, rearrange columns, present hierarchical data, selective area reloading through AJAX, feature-rich Visual Studio designer support, sorting using multiple columns, data grouping, data binding tools for complex data structures, enhanced data editing and delivery of data-pages through streaming. I think these features are very much possible! Don't you think its cool? (hence, the name CoolGridView, by the way :)  my next installment - having a CoolGridView with resizable columns is already on the way.

Thinking Ahead : To Infinity and beyond..

This year I have decided to jump a little higher and put a little more "sweat" into the project. And surely I will be blogging more about it. But I cannot run the next mile alone.. I need your help. Your inputs are very valuable (not to mention, it boosts my confidence from zero to maybe, 10). Whenever I log on and see a few comments which meant somebody out there finds this dream of mine workable, doable.. possible, I literally dash to my work desk and start pounding on my keyboard and try to do my best to keep you all in the loop of things.

I am glad to tell everyone that because of the recent string of feedback I received in the past couple of months, we were able to make CoolGridView more stable . We were able to make sure that the features worked perfectly on different browsers - Internet Explorer 8/7/6, Firefox 3.5/3.0, Safari and Chrome. This was made possible because you have all used the control and provided feedback. It's Teamwork, i guess so I thank you. I am indeed very grateful.

I hope that you would all stand by me in making this distant dream of mine a reality. This year let's create a CoolGridView control that is easy to use and packed with lots of useful features.

"To infinity and beyond..."

Labels: , , , , , , , , ,

 Subscribe to feed

Render ASP.NET GridView Control with Resizable Column Header

Make the column headers of ASP.NET GridView control user-resizable with this three easy steps.
  1. Download the JavaScript file from here.
  2. Include the JavaScript file into your ASPX page.
  3. Finally, initialize the component for your GridView control by inserting this JavaScript code at the end of your ASPX page.
    var _ResizeTableHeaderDecorator = new ResizeTableHeaderDecorator({ GridID: "<%=GridView1.ClientID %>" });
    Replace "GridView1" by the ID of the GridView control you want to enable column resizing.
It's that easy. It is tested to work with IE 8, Firefox 3.5, Safari and Chrome. This feature will soon be integrated with CoolGridView ASP.NET control. Here is a live example.
Column 1
Column 2
Column 3
Column 4
Column 5
Column 6
Column 7
Orange
Orange
Drive Sample
Great
Orange
Gateway
Gateway
Apple Drive
Doorway
Apple
Drive
Apple
Orange Doorway
Drive Sample
Great Apple
Gateway Gateway
Apple
Drive
Apple
Sample Drive
Sample Orange
Gateway
Doorway Doorway
Great
Great
Great Orange
Orange Doorway
Doorway Drive
Drive
Sample
Apple
Gateway
Apple Great
Orange Great
Orange Gateway
Gateway
Sample Drive
Sample Drive
Apple Apple
Orange Gateway
Drive
Gateway
Great Drive
Gateway
Drive
Great Doorway
Doorway
Orange
Doorway Sample
Gateway
Doorway
Great Doorway
Great Orange
Sample Doorway
Orange Apple
Sample
Drive
Great Gateway
Apple Apple
Gateway Orange
Drive
Gateway
Drive
Drive
Drive
Orange
Drive
Great
Doorway
Great Sample
Great Sample
Sample Sample
Drive Sample
Apple Great
Great Sample
Gateway Orange
Great
Great
Orange Gateway
Apple Doorway
Great Gateway
Drive
Apple Great
Great Great
Orange
Great
Apple Sample
Great Drive
Doorway
Doorway
Great Great
Orange
Drive
Doorway
Doorway
Gateway
Drive
Doorway Drive
Orange Gateway
Sample Apple
Apple Orange
Orange Gateway
Sample
Drive
Great Orange
Doorway Drive
Orange
Apple Doorway
Sample Orange
Orange
Sample
Apple Great
Gateway
Gateway Orange
Apple Apple
Gateway Apple
Great Orange
Doorway Great
Great
Doorway
Sample
Great Gateway
Drive Apple
Great
Orange Great
Orange Sample
Sample Great
Apple
Sample Sample
Doorway Apple
Gateway
Orange
Apple Doorway
Sample
Drive
Great Orange
Sample
Doorway Gateway
Doorway
Orange Apple

Labels: , , , , , , , , , , ,

 Subscribe to feed


John Eric Sobrepena

John Eric Sobrepena
Hi, I am an I.T. professional who loves technology. I am right now into Android development. I am also a subject matter expert on C#, ASP.NET, WPF and Silverlight. Photography is one of my many hobbies.
Bookmark and Share

Type your Email

Follow me on Twitter.

Flickr Photostream



 Subscribe to feed


Powered by Blogger



© 2006 IdeaSparx | Blogger Templates by GeckoandFly.
No part of the content or the blog may be reproduced without prior written permission.