Here is the gist page, if it doesn't show up here.

It seems to work pretty well and it's pretty simple, as long as it receives valid JSON.

Ever wish you could work with JSON in .NET as you normally do with regular old objects? Well, now you can:

string url = "https://github.com/api/v2/repos/show/kamranayub";
dynamic[] repos = JsonService.GetFrom(url).repositories;

return View(repos.OrderByDescending(r => r.watchers);

Enter .JSON, a single file that holds 2 classes you can use to manipulate JSON in a dynamic way, either from web services, strings, or objects.

dynamic json = Json.Parse("{'foo':'bar','baz':['a','b','c']}");

string foo = json.foo;
string[] = json.baz;

Inspired by Massive, I decided this would be a useful tool for the community, seeing as all the existing JSON libraries for .NET are not exactly what I'd want when dealing with JSON data.

I wanted several things from this:

• Ease of use
• LINQ
• Dynamically typed
• GET, POST, and authentication support
• One file
• Minimal dependencies (there's one for using Microsoft's built-in serialization/deserialization of JSON but it's GAC'd at least).

I am happy to say that as it stands, I've accomplished all of them. If you spot bugs, open an issue or patch it. I plan to refactor it a little to support a Fluent interface, but other than that, it pretty much just works.

Happy JSON'ing!

You stole this from so-and-so's book, it's almost exactly the template they provide, blah blah, more false accusations.

I offer you, accusation-spewing fiend, some proof that I own this code:

Is their template laid out exactly like this? Doubtful considering I made it.

Yep, looks like my code alright…

Hey look, API documentation for everything I made?

I don't know what template you were looking at, but I'll give you $1000 that it doesn't have any of those functions. All of these helpers have been functions I've made in the past during my years as a programmer. Hell, I probably can dig up a lot more.

Anyway, I don't need to prove myself to you. It's not fake, I worked on it for about a week, and I should really update it, thanks for reminding me. It's just a template that helps people get up and running a bit faster during development, the helpers are a useful add-on.

If you don't like it, use Sharp Architecture. It's probably more up-to-date now, anyway! I have been considering taking my template off Code Canyon anyway in favor of creating a new, free template on GitHub and keeping just packaged snippets to being sold. Mine is woefully out-of-date with best practices (LINQ to SQL??? No DI containers??? The horror!).

Good day to you, sir.

I've been working on a project that has required me to parse and manipulate XML on the client-side. Since I was using jQuery on the project, it made sense to leverage its cross-platforminess and easy coding style to manipulate the XML.

Unfortunately, jQuery hasn't really buried its claws very deep in the XML realm because if you've tried doing anything with XML you've probably run into issues. If you don't care about IE, you'll probably have less issues, but in my case, I had to support IE and even with vanilla jQuery, some things still don't work in other browsers.

In plain old Javascript, you can manipulate XML in IE using ActiveX and the MSXML object. However, it's IE-specific and it lacks the ease of use of jQuery. I wanted a way to leverage jQuery and also support multiple browsers.

So, I've created a helper function (plugin, really?) that helps jQuery deal with the XML and any nuances it has (such as text vs. CDATA nodes, etc.).

You use it just like you normally would with jQuery with one exception:

var $xml = $.xml("<your_xml_string />");

You have to use the function I created to instantiate it.

Other than that, I've tried to make it as seamless as possible, though I have yet to test every use case. I got it far enough that it works for my project, even doing some advanced selectors and manipulation. Webkit has a bug with the appending but I'm hopeful when I sit down and look at it it'll be an easy fix. I seem to have fixed the Webkit bugs.

There are two XML-specific functions you can use when dealing with my plugin as well:

// 1. .cdata()

// Get CDATA, which will return non-encoded data
$xml.find("mynode").cdata();

// .html() has been redirected to use CDATA on XML documents
$xml.find("mynode").html();

// To set CDATA, use the cdata function
$xml.find("mynode").cdata("<strong>html</strong>");

// 2. .xml()

// Use .xml() to get the outer XML of the element
var wholeDocument = $xml.xml();

var nodeXml = $xml.find("mynode").xml();

I've posted it on GitHub for a reason. I don't exactly plan to add anything extra unless it has a bug I directly deal with in my project (after all, I made it to get the job done). However, you can totally make it better if you feel like it and I'll merge your changes to the trunk. Fork it, pull it, whatever, I welcome any additions and help.

Features

• Added Gravatar support for comments. Incredibly easy to do and really makes them pop!
  
  
  
• Added RSS for comments on blog posts so you can keep track of responses (instead of .aspx for the post, use .rss, or subscribe using the browser functionality or the link above the comments)
  
  
  
  

Bug Fixes

• URL parsing in comments fixed (case sensitivitity issue)
• Converted UTC dates for posts back into local (server) time
• Some blog API fixes

I have set up Web Deploy on Arvixe and it really makes it easy to push these kinds of updates out.

So, that's why I am leaving it up to you if you want! You can pull my GitHub repos to your local computer and patch them. If you push them to your fork, I may even pull them into the main branch if your patches are awesome.

I've added:

• jQuery RTE
• Image Grid Creator
• Just Another Carousel

I am also thinking about releasing my WPF Black Jack application for anyone to fix. It's like 6 years old now but still pretty neat.

Remember way back when I posted about the upcoming redesign? It’s here! I figured it was a good time to spend a couple days and finish up the last few modifications to the site.

One of the big features I added was RSS support for many different types of things like projects, releases, tags, blog posts, designs, etc. You can keep up-to-date pretty easily now.

I don’t want to spoil anything for you, so just have a look around!

Other than this redesign, I hope to work more on my Code Canyon projects and release some new material. I may also play with some Android application development.

If you’ve been wondering what I’ve been up to, I currently work full-time at General Mills as a programmer analyst. I won’t be taking on any huge projects because of that, but if you have a small one, feel free to pass it by me.

For those of us too impatient to wait for Visual Studio SP1 to natively support IIS Express, I've done some digging and found a way to [fairly] easily setup a debugging environment for IIS Express and VS 2010 (should work for VS 2008 also, though!). This assumes you are at least an intermediate user of .NET/IIS and Visual Studio.

Prerequisites

1. Download and install IIS Express.
2. Be using Visual Studio 2010 or 2008 and a web project to debug.

Steps to Setup IIS Express

It's actually quite simple to setup IIS express. Once IIS Express is done installing, go to "My Documents\IISExpress8\config".

Right-click "applicationhost.config" and open in your favorite text editor.

Go to line 145. Notice the <sites> element. This is where we can configure our website for IIS Express. Copy the site that is already there and add another entry below it.

Remove the "autoStart" attribute for the first site.

This should be self-explanatory, but in case it isn't, we are setting up a root site in IIS:

• "name" is what you want the website name to be. This can be whatever you want.
• "id" is just the ID of the site for IIS Express. Increment it.
• "physicalPath" is the directory your site files are located in, i.e. the root folder of the website. Mine is below:
  
  
• "bindingInformation" is where you set the host name and port you want the site to run in. This can be whatever you need it to be, perhaps if you have a static port set on your VS project.
• "applicationPool" is the app pool to run under. This is important! If your site is .NET 4, you can use "Clr4IntegratedAppPool". If you are .NET 3.5 or below, you must use "Clr2IntegratedAppPool". Otherwise you will get config errors.

Let's test it out! Save the config file and close it.

Go to Run… and type in the following command:

"C:\Program Files (x86)\Microsoft WebMatrix\iisexpress.exe" /site:{YOUR_SITE_NAME}

Replace "{YOUR_SITE_NAME}" with the name you gave the site in the config file above. If you are on 32-bit windows, omit the " (x86)" part after Program Files.

Side Note: You can get a list of command-line switches by going into Command Prompt and typing in "iisexpress /?". You'll notice you can also directly launch any site by physical path and desired port.

Now open your browser and browse to the URL of your site! Voila, it should work (or not, in my case… but that's because this isn't my dev machine):

You might want to create a shortcut on your desktop to the run command I had you type in earlier. It will make it a lot easier to start IIS Express when you're developing.

Note: Now that you've set up this web site, you could manage it from the WebMatrix GUI if you prefer that method for more advanced settings.

Setting up Visual Studio 2010/2008

Go ahead and open up your solution in Visual Studio.

Right-click on your web project and go to Properties, then the Web tab. Click the "Start URL:" radio button and put in the path to your site:

Then below it, click the "Use Custom Web Server:" radio button and again put the path to the URL:

Next, and this is important, uncheck everything below it. Visual Studio will try to attach to the non-existent IIS server otherwise and not let you debug. We're sort "tricking" it into using IIS Express.

Save and close the project's properties. Now hit Alt-F8 to open up Macro Explorer. Right-click on the My Macros –> Module 1 node and click "Add Macro."

Use the following macro:

Source:

Public Sub AttachToIISExpress()
    For Each process As EnvDTE.Process In DTE.Debugger.LocalProcesses
        If (process.Name.IndexOf("iisexpress.exe") <> -1) Then
            process.Attach()
        End If
    Next
End Sub

That is it. The process to follow is:

1. Start IIS Express using the run command/shortcut above.
2. Hit F5 to start debugging. Visual Studio will enter debug mode and start the site in a browser window.
3. Next, run the macro we created to attach to the IISExpress server.
4. Voila, you now can debug not only your solution's code but also any scripts loaded by the browser!

Setting up a Keyboard Shortcut

If you're like me, right-clicking and running the macro is too much work! So let's create a keyboard shortcut, shall we? How about 'F4'?

Go to Tools –> Customize… then click the "Commands" tab. Select "Debug" in the "Menu bar:" drop-down.

Click "Add Command…" and click "Macros" in the left-hand list. Click the IISExpress macro.

Now just rearrange the list to your liking. You can click the newly added command and then click Modify Selection –> Rename.

Click Close and close the customize dialog.

Go to Tools –> Options. Click Keyboard in the left-hand list. Start typing "view.prop" to find the Properties Window keyboard shortcut (already assigned to F4). Hit Remove to get rid of the F4 shortcut.

Now type in "iis" to filter down to the IIS macro. In the shortcut keys box, hit F4, then Assign.

All done! Now instead of right-clicking the macro every time, you only need to hit F4 after you hit F5.

Closing Comments

Remember that this is just a temporary workaround until Scott and his ninja team release a hotfix for Visual Studio to enable native IIS Express integration. I needed this functionality this weekend while working on a project (due to how Cassini handled URL requests and because attaching to IIS 7 for debugging was not working for me).

I hope this helps some other fellow curious developers. As always, leave a comment if you have a suggestion to streamline this even more (I attempted to wrap the whole debug process into one macro with no success… maybe someone smarter than me can!).

I made the decision to switch to Arvixe after I couldn't get sub-domains to work on the new Webhost4life platform for the life of me. Their control panel was just abominably slow and didn't allow the control I needed.

I googled "top rated asp.net web hosts" and Arvixe was one of the top on the list. I searched other rating sites just to be safe. While their site was nothing much to look at in terms of design, their feature list was quite impressive (ahem, multiple MSSQL databases? Score!). It took me about 5 minutes to setup my account, another 5 to backup and restore my database to their server without a hitch, and not very long to transfer all my existing files over via FTP. I set up my mail accounts (and I use POP3, so I didn't worry about losing any mail) and pointed my domain's DNS name records to their server. All done in the span of a couple hours.

I must say, I am pretty pleased with the experience. Not only that, my site is way faster… and will be even better once I release the new site (it's coming soon!).

No host is perfect and I'm having some trouble setting up password protected folders but for now I use Forms authentication so it's not too big of a deal.

Presentation

This last new year, one of my resolutions was to become more a part of the developer community whether that included more articles, more projects, contributing to projects, etc. Unfortunately, school and work interfere with that but I have made progress. Recently I've released a couple projects on CodeCanyon (the "app store" for code snippets) and I've undertaken redesigning Intrepid Studios. I also have a few drafts of articles to submit when I get around to them.

Anyway, this post is a sneak peek at some of the new changes coming to the site. Hopefully, they are much better than what's currently on here.

Give Me Feedback

Before I show you the preview, I wanted you to know you can give me direct feedback on different UI designs at my public WebSlide revision. Click on the comments link in the bottom right corner to post a comment to a specific slide.

Stay Connected and Up-to-Date

Right now, there's no easy way to keep up-to-date on my activity besides following the blog. Even then, I don't record everything I do here… to fix this, I've added RSS feeds to almost every aspect of the site including: all project activity, individual project activity, individual post activity, blog post archives, tags, and design activity. If you care, I created a neat little RssService that lets me transform (virtually) any LINQ query into an RSS feed using some basic mapping. Makes it a snap to create new RSS feeds for the site.

I've also added RSS icons to various places of interest, as well as tied into the browser address bar like most sites do.

Major UI Overhaul

Besides many back-end improvements, I've also spent a lot of time redesigning major portions of the site. I've also put some tender loving care into revamping parts of the site that currently aren't very… pretty (*cough*A lot of it*cough*). The reason some pages were left behind was priority and general laziness. It's high time to fix that! Here are some previews:

Main Designs Page

Individual Design Pages

Main Project Page

Individual Project Page

Blog Homepage

Individual Blog Posts and Comment Section

Footer

No Images, Oh My!

I am also a big proponent of standards-based web design. That's why all those cool transparency, shadow, layered backgrounds, and everything else except icons are all CSS-based. Yes, even those rotated tags (CSS 2D Transforms FTW!). Okay, the tags have one PNG background to them for that tag effect but still! The words in the background aren't CSS-based but I am thinking of it, since it is only Century Gothic.

When's It Due?

Soon. I just need to revamp a few more parts of the site and it will be ready to go live. Sometime this month I'll release it and I will also go through the improvements in a comprehensive blog post, letting you inside my mind and explaining why I made some changes that I did.

Until then, share your feedback from these glimpses, good or bad. I always look at feedback on my designs.

I've just released my Web Application Template package for .NET web applications (and it's only $12). It's basically what I would prefer to start with every time I work on a new web site… in effect, a "Web App in a Box."

It supports .NET 3.5 and .NET 4 and offers a slew of features (ELMAH integration, compression/minification of CSS and JS, etc), the to-do list ever growing. You can be sure I'll keep it updated because I will be using it myself! I'm already using it for a new version of Intrepid Studios (not a total redesign, more enhancement-like).

I was sick and tired of all my projects using different file/folder/solution layouts and having to duplicate code across them all the time. I wanted a way to easily get started without spending time configuring everything. While I was working on it, I thought it would be useful for other developers. Will it really save you six hours? Well, it took me a solid 6+ hours of development time to set it up… and then some. Six is a safe bet, possibly more if you aren't that familiar with some of the components I integrated.

As always, let me know if there are bugs and improvements you think of.

You can also check out my previous CodeCanyon release, Google Picasa Gallery + API.

There is a StackOverflow discussion about this with a workaround that ended up not using UrlRewritingNet at all unfortunately. In addition, there's a detailed post about doing some voodoo and mixing potions to get UrlRewritingNet to work. Note that you can simply remove the defaultPage attribute on the urlrewritingnet config section to solve this, but it may cause other unintended consequences.

I thought to myself, there's gotta be a better way! And there is (well, it's a hack so I suppose it is not entirely the best, but it is the simplest so far). I simply added in a few lines of code to the UrlRewritingNet source code to allow you to ignore URLs. Without knowing much about how the component works, this is an easy "patch."

Download the Modified Binaries

For those that don't care how I did it, I have uploaded the modified binaries you'll need to replace in your application. See below for an explanation of how to use it.

• Download the modified binaries (v0.1) – 3/26/2010

Getting the Source

Head over to the Downloads section of UrlRewritingNet to get the source code.

Extract the files to a directory of your choice.

I opened and converted the solution with VS 2010, but you can use anything you wish.

Modifying the Files

We will modify 3 files. Follow along below.

In WebRewriteOption.cs, add another value to the enumeration like so:

[Flags] 
public enum RewriteOption
{
    Application = 0x00,
    Domain = 0x01,
    None = 0x02 // KR: Ignore the URL
}

In WebUrlRewriteModule.cs, around line 212, add the following underneath if (rewrite.IsRewrite(requestUrl)):

//KR: ignore url
if (rewrite.Rewrite == RewriteOption.None)
{
    rewritten = true; // sure, we totally "rewrote" it, heh.
    break;
}

In urlrewritingnet.xsd, change the xs:simpleType for RewriteOption to be:

<xs:simpleType name="RewriteOption">
  <xs:restriction base="xs:NMTOKEN">      
    <xs:enumeration value="Application" />
    <xs:enumeration value="Domain" />
    <xs:enumeration value="None" /> <!-- KR Ignore URL -->
  </xs:restriction>
</xs:simpleType>

Finally, in the same file, change the use="required" attribute of destinationUrl to be optional, like so:

<xs:attribute name="destinationUrl" type="xs:string" use="optional" />

Build the solution in Debug/Release and copy over the new DLLs to your project. Voila, all done! Now all you need to do to NOT rewrite a URL is the following:

<add name="Elmah"
  virtualUrl="^~/elmah.axd(.*)$"
  rewrite="None"
/>

I've tested it with Intrepid Studios and it seems to work just fine.

As always, feedback and improvements are much appreciated!

A new minor update has been released to the jQuery Rich Text Editor with some new icons and an ASP.NET demo.

Changes

• Added Silk icons for a nicer look
• Added ASP.NET demo solution to test the script
• Added extra function "$.rte.html".
• Updated code to match latest changes in Google Code repo.
• Note that this release contains BREAKING CHANGES because the options have all been renamed (see Documentation)

I tested the script with the latest jQuery release and it still works.

Let me know if you run into any trouble. I think it may still have some trouble with nested controls, which I will test soon, since my admin panel wasn't saving the text written in the control.

View the project homepage for the jQuery Rich Text Editor

Long story short: disable Hamachi or any other potential virtual network adapters. VMWare seems to not interfere but Hamachi enjoys taking over connections sometimes and will hijack your phone emulator.

You can view the details of my adventure right over yonder.

If you remember my short code snippet on creating a PHP Picasa photo gallery, .NET developers were left in the dark. Since I needed to convert my PHP implementation to .NET, I decided to make it a pet project to test out the waters of the CodeCanyon marketplace.

If you want a simple API and gallery all packaged up for you for a low price then head on over to the project page.

My primary responsibilities included overall graphic design and UI (Photoshop, HTML, CSS3), some JS work, and some PHP work.

Big thanks goes out to the team: Ellie for her astounding SketchUp work, Zach for his managerial prowess, Ken for his awesome paging routines, Ethan for his JS ninja skills, Trent for his hardware expertise, and Sungho for getting the webcam working!

We're proud to announce a new website we've developed for our client Measure Custom Clothing. They sell custom suits and shirts at low prices in the Twin Cities area.

The site was developed in .NET, programmed in C#. In addition to the public-facing pages, I also developed a custom sales order and customer management system. Managers and sales associates can create new sales orders, print them, email them, and keep track of their status with an administration panel.

If you're looking for a good suit (and I can vouch for their quality), please check them out!

Here's what we ended up using, thanks Doug!

http://github.com/dsparling/jclock

That has the latest version.

I would have preferred it using datejs's style format specifiers but it does the job aptly.

PS. I found it by Googling "jClock," the name I was going to use for my plugin.

Here's a quick fix to bypass that rule:

1. Navigate via command line to the directory of the setup. When uninstalling, this is located in: C:Program FilesMicrosoft SQL Server@Setup BootstrapRelease
2. Run this command:
   
   setup.exe /Action=[un]install /SkipRules=RebootRequiredCheck
   
3. Use "uninstall" and "install" where applicable.

Refer to this blog post for some other tips.

I made the video by taking a still image of the "screen", plugging it into iMovie HD and applying the Aged Film effect. Then I kept it at 5 seconds, exported it as a MOV at my needed horizontal resolution (624 pixels). I used ffmpegX to convert the MOV to an FLV file and used its cropping feature to make the video the size I needed (624x356).

The specs on the FLV are as follows:

• 100 bit data rate
• 12fps
• Video size: 624x356 (Unconstrained)
• Crop: 52 52 0 0 (top bottom left right)
• No audio

That produced a 100KB FLV, which I still think is pretty high, but it's at least manageable. Here's how it all looks on the page:

For the FLV player, my requirements for were as follows:

• Auto start
• Endless loop
• No controls
• No watermark
• Ability to view without JS or Flash

As you can see, I've accomplished all of this (works in IE6+, FF, Opera, and Safari) except that the "no controls" part is a hack. The FLV player I am using, FLV Flash Fullscreen Video Player, does not yet allow removing the control bar. However, because I am using an overlay it hides the control bar so the only time a user could see it is if they zoom in. It's not a big deal if that happens, as long as initially it shows correctly. The author is working towards allowing the control bar to be disabled.

Both FlowPlayer and JW Player, while awesome, have watermarks. I just needed something simple that could serve my purpose. I could possibly get around that by adding padding to the video itself on the bottom, but I don't think that's cool to do. Additionally, JW Player showed the preloading graphic when it restarted the video, not cool.

You can view source to see what I did to make it all work, probably the most important part being that wmode for the object tag is set to transparent in order to see behind the video when it's loading (displaying the static background image). It also allows for z-index positioning so that the overlay appears above the video.

If you know of a player that does have all the features I need, please let me know in the comments!

My primary job was to design the new interface and program the back-end. I had never worked with MVC in PHP before and I can safely say that my code looked as good as my old ASP days. We are continually improving the code, though, so hopefully by this time next year the back-end won't be as convoluted. It was a good lesson in MVC design.

Before & After

On the left, before, on the right, after:

Big Features

There were many features we added to the new site, some ideas from users others from my own observations and still others from the rest of the team.

Some of the big features and changes we added were:

• Photo Slideshow: The space pages include a slideshow of all the photos of the space which includes layout photos. This was done using the jQuery Cycle lite plugin. Viewing the bigger photos was done in Lightbox-clone Colorbox.
• Detailed Layout Info: In the old site, visitors could see a tiny summary of the different layouts available. In the new version, we show thumbnails of the photo and floor map, as well as suggested events that the layout is optimized for. You can click a layout and a popout will come up with even more info.
• Features and Services: The old site included a bullet list of features of the space but didn't provide any more information than that. The new site does this and also has the ability to have tooltip information as well as links to separate pages.
• Personalized Rates: Finding out how much a room cost on the old site was a downright chore. We simplified this part by only showing the rate for who you are. If you're a student group, it will show student rates on the space page.
• Reserve Layouts: On the old site, if you clicked "Reserve" for a space it would only go to the inquiry page and you'd need to fill out everything yourself. On the new site, you can not only reserve a space, you can also directly reserve a specific layout.
• Revamped Inquiry Form: The old inquiry form was atrocious, a UI and usability disaster. We developed a custom form helper and standardized form styles to greatly improve the user interface. We also used some AJAX and jQuery to dynamically choose rooms to reserve.
• Progressive Enhancement: If you don't have JavaScript, you can still use the site fully. If you don't have styles, no problem. The whole site is usable in a bare-minimum environment.

These and more were where most of our work went, along with an entirely new back-end.

We were really happy with how it turned out and we're currently working on helping users actually find the right space for them. That will be the next big feature.

I ran into some hiccups and I want to share the solutions for others that have had similar problems:

That assembly does not allow partially trusted callers.

This took me awhile to figure out. Here's what I did to fix it:

I made sure all three assemblies in the Bin directory were strongly named and had the [assembly: AllowPartiallyTrustedCallersAttribute()] in the Assembly.cs files of each project.

Note: All three DLLs were my own so I could edit them. If you are using 3rd party components, make sure they have the above attribute and are strongly named. Most big components should.

Tip: When I added that attribute to Assembly.cs and built the projects, then copied the DLLs to the host, I still got the Security Exception. To fix it, I deleted both the bin and obj folders from each project, built them, then copied over the new DLLs to my web site application project and subsequently to the FTP site. I don't know why, but that worked.

Failure sending mail

This was a quick fix. I was using System.Net.Mail to send email. Using smtpout.secureserver.net and port 25 worked on my local server but not on GoDaddy's server. Instead you need to use relay-hosting.secureserver.net.

Example web.config section that I use (goes after </system.web>):

<system.net>    
    <mailSettings>
        <smtp from="mailbox@mydomain.com">
            <network host="relay-hosting.secureserver.net" port="25"
                userName="mailbox@mydomain.com" password="myPassword"/>
        </smtp>
    </mailSettings>
</system.net>

It's a good idea to make sure mailbox@mydomain.com is a real account setup on GoDaddy.

After talking about it amongst ourselves and doing some quick Googling, this is what we decided:

For file names and paths, use dashes because most search engines (Google included) treat dashes as separate words. So "monkey_wrench" gets indexed as "monkey_wrench" but "monkey-wrench" gets indexed as "monkey wrench." Similarly, in code editors usually they will highlight the entire phrase if it includes underscores on a double-click while they will only highlight the selected word if it is dashed, which I prefer.

For variables, or anything that does not really need to be indexed, you can use whatever you see fit (note: most languages don't allow dashes in variables/functions).

If you have any thoughts or disagree, please share it in the comments.

We just finished a new web site today, BeReasonableNow.com, for a lifestyle guide. The web site was created for a friend of mine. I've seen the guide, there's nothing magical about it, it's totally practical and pretty funny. Check it out!

I decided since this was a one page deal that I'd try out a few design ideas I've seen lately including subtle radial gradients and larger text. I like how it turned out.

All the effects except the gradient and title image are CSS: border-radius, box-shadow, background gradient, and text-shadow primarily. I was also thinking of using the new @font-face but Arial didn't look that bad so I just left it.

To see what the site should look like, view it in Safari/Webkit. The only major difference is the background gradient on the submit button at the bottom. That's progressive enhancement for you!

Now, hopefully, real comments will be un-moderated while spam comments will not be published.

With all the spam comment notifications I get, I miss real comments so it takes awhile to get around to approve them. I found about 4 real comments today while I deleted the spam ones, so I apologize for getting around to that so late. Hopefully it will be a non-issue now!

There's an easy way around this and it works wonders for usability. In your LinkButton or Button controls, just modify the PostBackUrl property to point to an anchor in your form.

For example, let's assume this is a really long form with multiple ListViews, nested stuff, etc. My markup might look something like this:

<!-- Lots of other stuff -->

<asp:ListView id="foo" runat="server">
    <LayoutTemplate>
        <div>
            <asp:placeholder id="itemPlaceholder" runat="server" />
        </div>
    </LayoutTemplate>
    <ItemTemplate>
        <p>
            <%# Eval("Something") %>
            <asp:button id="btnEditFoo" CommandName="Edit" runat="server" />
        <p>
    </ItemTemplate>
    <EditItemTemplate>
        <div>
            <!-- textbox -->
            <asp:button id="btnFooEdit" runat="server" />
        </div>
    </EditItemTemplate>
    <InsertItemTemplate>
        <div>
            <!-- textbox -->
            <asp:button id="btnFooInsert" runat="server" />
        </div>
    </InsertItemTemplate>
</asp:ListView>

Well, when the user clicks Edit or Insert, on PostBack they're going to be returned to the top of the page. How can we fix this to make the UX (user experience) better? Here's how:

<!-- Lots of other stuff -->

<asp:ListView id="foo" runat="server">
    <LayoutTemplate>
        <div id="foo-container">
            <asp:placeholder id="itemPlaceholder" runat="server" />
        </div>
    </LayoutTemplate>
    <ItemTemplate>
        <p>
            <%# Eval("Something") %>
            <asp:button id="btnEditFoo" PostBackUrl="#foo-edit" CommandName="Edit" runat="server" />
        <p>
    </ItemTemplate>
    <EditItemTemplate>
        <div id="foo-edit">
            <!-- textbox -->
            <asp:button id="btnFooEdit" PostBackUrl="#foo-container" runat="server" />
        </div>
    </EditItemTemplate>
    <InsertItemTemplate>
        <div id="foo-insert">
            <!-- textbox -->
            <asp:button id="btnFooInsert" PostBackUrl="#foo-container" runat="server" />
        </div>
    </InsertItemTemplate>
</asp:ListView>

So what have I done? I've added IDs to the containers in the ListView and added PostBackUrl to my buttons and pointed them to the IDs (using regular HTML anchor syntax). Now when someone clicks Edit to edit something, it will PostBack to MyPage.aspx?q=whatever&moreq=foo#foo-edit. How nice! It even preserves your querystring.

Hope that helps you!

Public Module TypeExtensions

    <Extension()> _
    Public Function ToArrayOfInts(ByVal str() As String) As IEnumerable(Of Integer)
        Dim intRef As Integer
        Return str _
        .Where(Function(s) Not String.IsNullOrEmpty(s) AndAlso Integer.TryParse(s, intRef)) _
        .Select(Function(s) Integer.Parse(s))
    End Function
    
    <Extension()> _
    Public Function ToArrayOfInts(ByVal str As String, ByVal delimeter As String) As IEnumerable(Of Integer)
        Return str.Split(delimeter).ToArrayOfInts()
    End Function

End Module

You can use it like this:

foo.Text = "093,s,44g,sj38,87,6".ToArrayOfInts(",").Count().ToString()

<asp:LinqDataSource id="MyDS"
    Where="MyGuidColumn.ToString() == @StringGuid"
    ...>
    <WhereParameters>
        <asp:QueryStringParameter QueryStringField="Id"
            Type="String" Name="StringGuid" />
    </WhereParameters>
</asp:LinqDataSource>

If you use a Session or some other parameter that returns the Guid itself, you have to have Type="Object" in your parameter, like in my project:

<asp:SessionParameter SessionField="ColumnId" Type="Object" Name="ColumnId" />

You have a ListView that dynamically loads different ItemTemplates depending on a specific criteria (in my case, a category). You load this user control template into the ItemTemplate and create some radio and checkbox buttons. If you set GroupName on the controls to a group name, .NET will not associate all the different buttons across the templates because they have different naming containers.

I have a dynamically generated form where the user selects from a multitude of options (i.e. each ListViewItemTemplate contains an input control), so this default behavior doesn't work so well. Some might say to scrap the custom ListView and create a composite control that inserts different controls depending on a parameter but then you get into a lot of databinding issues and viewstate tracking issues. I wanted to avoid all of that. Note: If someone has a good way of doing this, please let me know!

Here's what I came up with. It derives from a RadioButton (but a CheckBox would work too) and adds two custom properties, Name and Value, allowing you to specify the value of the input and name of the input. It overrides the Render event and outputs custom HTML depending on if the button was checked on PostBack. It works great!

Public Class CustomRadioButton
    Inherits RadioButton

    Public Property Name() As String
        Get
            Dim o As Object = ViewState("Name")

            Return If(o Is Nothing, String.Empty, CStr(o))
        End Get
        Set(ByVal value As String)
            ViewState("Name") = value
        End Set
    End Property

    Public Property Value() As String
        Get
            Dim o As Object = ViewState("Value")

            Return If(o Is Nothing, String.Empty, CStr(o))
        End Get
        Set(ByVal value As String)
            ViewState("Value") = value
        End Set
    End Property

    Protected Overrides Sub Render(ByVal writer As System.Web.UI.HtmlTextWriter)
        If Page.IsPostBack Then
            writer.Write(String.Format("<input id='{0}' type='radio' name='{1}' value='{2}' {3} />", ClientID, Name, Value, If(Page.Request.Form(Name) = Value, "checked='checked'", String.Empty)))
        Else
            writer.Write(String.Format("<input id='{0}' type='radio' name='{1}' value='{2}' />", ClientID, Name, Value))
        End If
    End Sub
End Class

And in the user control:

<MyControls:CustomRadioButton ID="radButton" 
    Name='<%#String.Format("rad_group_{0}", Eval("MyGroupId").ToString()) %>' 
    Value='<%# Eval("MyValue") %>' 
    runat="server" />

<%-- You can also make it static text. --%>