Comments on: The SelectedTemplate and duplicate code

By: Frederik Vig

Frederik Vig — Thu, 12 Nov 2009 09:48:06 +0000

Ah sorry, then I would just use something like this:

<a href="#"
<% if(Container.CurrentPage.IsSelected(CurrentPage)) { %>
   class="selected">
<% }%>
<% else { %>
   class="notselected">
<% } %>

But again, at that point it might be better to use the SelectedTemplate .

By: Erik Nordin

Erik Nordin — Thu, 12 Nov 2009 09:40:18 +0000

I mean classes that should be there even though it’s not selected.

By: Frederik Vig

Frederik Vig — Thu, 12 Nov 2009 09:31:06 +0000

Hi Erik!
If you need to add more classes you just add them with spaces between them: < %# SelectedCssClass(Container.CurrentPage, "class1 class2 class3") %>.
I like the idea of extending the PageList and the container object. Looking forward to reading about it .

By: Erik Nordin

Erik Nordin — Thu, 12 Nov 2009 09:24:06 +0000

One big problem with this approach is if you want to add more css-classes, but I guess you could extend the method for adding this.

I’ve solved this issue by extending the whole PageList and added own templates (if preferred), but I’ve also extended the properties on the Container object with like IsFirst, IsLast, IsSelected, IsAlternating, ItemIndex and ItemCount. That’s all you need to achieve everything Going to blog about it when I have some time over.

By: Frederik Vig

Frederik Vig — Thu, 12 Nov 2009 08:55:14 +0000

Hi Eric!
In my experience I mostly end up just adding a class for the selected item. The frontend developer can easily add or change the class by simply changing the second parameter of the SelectedCssClass method (thanks Magne). If the markup and functionality differ much from the regular item, I would use the SelectedTemplate instead, since it makes sense to use in situations when adding everything to the ItemTemplate makes it more complicated and less readable.

You can also use conditional statements

<% if(Container.CurrentPage.IsSelected(CurrentPage)) { %>
   
<% }%>

I personally find readability more important than having zero duplicated code. So if the regular item and selected item differ much, use the SelectedTemplate. If they are quite similar, like in my example, try to combine them and add an extension or helper method for the logic, but make sure that it does not add difficulties for the frontend developer or others to perform small changes to the code .

By: Eric

Eric — Thu, 12 Nov 2009 07:57:09 +0000

Hi,

A thought: why would you like to create cs-code instead of using templates, except the fact of NOT duplicating code? Instead your are having the same functionality in code-behind forcing a gui-developer to re-compile when he/she only would like to change some style?
Maybe im too much of a gui developer but when creating html and styles I don not want to re-compile the project too often!

Credits to all your great posts!

By: Frederik Vig

Frederik Vig — Wed, 11 Nov 2009 17:24:08 +0000

Hi Magne!
You’re of course right. I’ve renamed the method to SelectedCssClass, which is a much more descriptive name, and added a second parameter where you can add the CSS class. This is also much more friendly for frontend developers, who otherwise would have to contact the backend developer if they needed to rename the CSS class or add another one.

By: Magne Thyrhaug

Magne Thyrhaug — Wed, 11 Nov 2009 17:13:10 +0000

Hi mistar Frederik!

First off: I very much agree. Remove all duplicate code. Good post

As far as code quality goes, I’ve got a thought: There’s nothing regarding the name of the function (isSelected) that states that it should return the a string. The name instead implies that it should return a boolean value – like (I assume) page.isSelected does. Using a more logical name most certainly would make it easier for the next developer

Another thought: What if you want more classes on the element?