Having Fun with SmartGridComponent

I am preparing to my Dev Teach talks, and I wanted to show a cool view component. Here is a sample of how it looks like now:

<%

component SmartGridComponent, {

      @source : customers,

      @displayAddress: false,

      @displayFax: false,

      @displayPhone: false

}

%>

I want to ignore some of the properties of the customer entity. This demonstrate both symbols in Brail (hmm, sounds like something else altogether :-) ) and using Convention over Configuration for this.

And here is a bit more complex example, showing how to display just the items that we want, in the order that we want:

<%

component SmartGridComponent, {

       @source : customers,

       @columns: [

              @customerId,

              @companyName,

              @contactName,

              @contactTitle

       ]

}

%>

And here is how I can override spesific behavior for the grid:

<%

component SmartGridComponent, {

       @source : customers,

       @columns: [

              @customerId,

              @companyName,

              @contactName,

              @contactTitle

       ]}:

       section customerIdHeader:

              output "<th>Id</th>"

       end

       section customerID:

       %>

       <td>${Html.LinkTo(item, "Customers", "ListOrder", item)}</td>

       <%

       end

end

%>

Here is how the last one looks like, by the way:

(Image from clipboard).png

Print | posted on Thursday, April 05, 2007 8:32 AM

Feedback


Gravatar

# re: Having Fun with SmartGridComponent 4/5/2007 9:36 AM Anders

Is it possible to do something like @customerCompany.Name?


Gravatar

# re: Having Fun with SmartGridComponent 4/5/2007 1:22 PM Ayende Rahien

It is not supported at the moment, but yes, that is trivially possible


Gravatar

# re: Having Fun with SmartGridComponent 4/5/2007 2:46 PM Richard LOPES

Hi,

I like this kind of code ! Looks like Rails.
In fact, Rails made me also build my components thinking convention over configuration. Simple ideas like that make our developer's lives easier !

I often think: Why should things be complicated ?
And what is a good programmer if not a lazy one ?

Thanks.


Gravatar

# re: Having Fun with SmartGridComponent 4/5/2007 3:44 PM Jose

Nice code to a nice result. Where can I find the SmartGridComponent?


Gravatar

# re: Having Fun with SmartGridComponent 4/6/2007 1:32 AM Brendan Rice

Nice work Ayende. Are you teasing us or are you going to show us the source?

I found this great link the other day, I just had to share:

http://icant.co.uk/csstablegallery/index.php?css=20#r20


Gravatar

# re: Having Fun with SmartGridComponent 4/6/2007 1:38 AM Ayende Rahien

Definitely teasing, I have got a secret agenda that I want to carry on for a while


Gravatar

# re: Having Fun with SmartGridComponent 4/7/2007 11:12 PM Ayende Rahien

@Jose,
http://rhino-tools.svn.sourceforge.net/viewvc/rhino-tools/trunk/SampleApplications/Exesto/Rhino.Components/


Gravatar

# re: Having Fun with SmartGridComponent 4/12/2007 1:15 PM Adam B

I am using your smart grid component now exactly as you have described here albeit with NVelocity. It's really nice to use.

I was wondering, is it possible to add extra columns that are not bound to the source, such as an edit and delete column? Perhaps passing in an id for the $item value so to use $HtmlHelper.LinkTo('Edit', 'customers', 'edit', $item). I haven't been able to figure it out.


Gravatar

# re: Having Fun with SmartGridComponent 4/12/2007 11:44 PM Simone Busoli

Ever heard of Repeater, DataList and GridView?


Gravatar

# re: Having Fun with SmartGridComponent 4/12/2007 11:49 PM Ayende Rahien

@Simone,
Why, yes I did.
Feel free to try to generate the same client UI for the grid view, I would be interested in seeing it.
The kind of things that I presenting here are nearly impossible to handle cleanly with those controls.


Gravatar

# re: Having Fun with SmartGridComponent 4/13/2007 3:19 AM Simone Busoli

Here's the code for a GrediView with the same UI.And you get sorting paging and a lot more for free:

<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataSourceID="SqlDataSource1">
<Columns>
<asp:HyperLinkField DataNavigateUrlFields="CustomerID" DataNavigateUrlFormatString="ListOrder.aspx?id={0}"
DataTextField="CustomerID" HeaderText="Id" SortExpression="CustomerID" />
<asp:BoundField DataField="CompanyName" HeaderText="Company Name" SortExpression="CompanyName" />
<asp:BoundField DataField="ContactName" HeaderText="Contact Name" SortExpression="ContactName" />
<asp:BoundField DataField="ContactTitle" HeaderText="Contact Title" SortExpression="ContactTitle" />
</Columns>
</asp:GridView>


Gravatar

# re: Having Fun with SmartGridComponent 4/13/2007 3:30 AM Ayende Rahien

@Simone,
Please check out this post:
http://ayende.com/Blog/archive/2007/04/08/Building-View-Components-For-MonoRail.aspx

Those are the capabilities that I am referring to, not just the basic of it.
Sorting and paging in the UI layer are a bad practice, mostly because it performs horribly the moment you put evena moderate amount of data into the system


Gravatar

# re: Having Fun with SmartGridComponent 4/13/2007 3:42 AM Simone Busoli

Looks to me like nothing you can't do with a Repeater as well, while a lot more like you're just trying to emulate what web controls do.


Gravatar

# re: Having Fun with SmartGridComponent 4/13/2007 11:32 AM Ayende Rahien

Simone,
The idea here is not the formatting.
The idea is the ease of using presentation logic.
If I want to display in red based on a certain condition:

<% section customerName:
if Controller.IsCustomerInDebt(item):
output "<td style='background-color: red'>${value}</td>"
end
end %>

Add several more condition, and a more complex UI requirements, and using web controls became a real PITA.

I did a screen cast on this subject, which you can watch here:
http://www.ayende.com/hibernating-rhinos.aspx

I hope it would make it clearer


Gravatar

# re: Having Fun with SmartGridComponent 4/13/2007 2:39 PM Simone Busoli

Didn't have time yet to check out your screencast, but I still don't get the point. Furthermore looks to me like your performing logic tasks in the view, what about using the ItemDataBound event of the ASP.NET web controls?


Gravatar

# re: Having Fun with SmartGridComponent 4/13/2007 2:48 PM Ayende Rahien

The ItemDataBound event is the reason that I am calling this PITA.
You have to workaround the control model to get what you want.


Gravatar

# re: Having Fun with SmartGridComponent 4/16/2007 2:38 AM Ayende Rahien

@Adam,
Yes, it is, just add them to the last column definition, and it would work


Gravatar

# re: Having Fun with SmartGridComponent 4/16/2007 11:09 AM Adam B

Ah yes, thanks, this worked:

#set ($cols = ["Code", "Company", "Website", "Description", "PrimaryKey"])
#blockcomponent(SmartGridComponent with "source=$results" "columns=$cols")
#PrimaryKeyHeader
<th></th>
#end
#PrimaryKey
<td>$HtmlHelper.LinkTo('Edit', 'account', 'edit', $item)</td>
<td>$HtmlHelper.LinkTo('Delete', 'account', 'delete', $item)</td>
#end
#end


Gravatar

# re: Having Fun with SmartGridComponent 4/30/2007 1:52 AM Tim Haines

Hi Ayende,

Interesting to see your work on this. The SmartGridComponent seems like it would be valuable to a lot of people that use Monorail. I've not yet grokked monorail enough to know if there's a place for contributed components? I'd like to use this, and extend it so clicking the column headers sorts the columns, add filters etc.

Having the component source live in a source repository for your demo app doesn't seem like a good place for a lot of people to reuse and improve it though.

What are your thoughts on this?

Cheers,

Tim.


Gravatar

# re: Having Fun with SmartGridComponent 4/30/2007 3:34 AM hammett

We could at least list them on http://using.castleproject.org


Gravatar

# re: Having Fun with SmartGridComponent 4/30/2007 4:56 AM Ayende Rahien

The SmartGridComponent is going to move to the Castle Contrib, to a project that would aggregate all the common components.
I just need to dedicate some time to actually finish this...

How are you going to handle the sorting?

Comments have been closed on this topic.