Here is example from fb:editor documentation:

First we need to include fb:editor tag to the page to force loading of CSS files:

Now we should define basic structure of the form:

BTW, we have several enhancements in the original layout: we have specified for attribute for the label tag (now if you would click to the label, corresponding input would be selected), and added ability to mark required fields with required text (it’s impossible with fb:editor).

Or even:

Almost 50% of this could be easily removed, and you will get beautiful and clear code, just right after you will understand what the hell is operator ??. Here is information from MSDN:

The ?? operator returns the left-hand operand if it is not null, or else it returns the right operand.

Easy and clean explanation. Let’s try to rewrite all these examples using this operator:

In case of value-types this approach will not work: you will get NullReferenceException. But do not worry — in this case we can use Nullable-types. Before:

After:

When you are using ?? operator, expression will be evaluated in the left to right order, so you can use something like this:

Of course, it looks more readably than the:

And a fortiori than:

Add it to your armoury!

Experienced developer, even if he is not a paranoiac, will find possible problem immediately — NullReferenceException. That’s because of caching implementation in ASP.NET. In ideal case an object, that has been cached, will stay there up to application restart, but in real world it could be deleted between two calls: by the garbage collector when memory is over (because cache uses weak references WeakReference); by another thread to refresh cached data.

So the code I have mentioned before works in 99% of all cases, but sometimes you will get errors in your log, which can not be reproduced easily. Here is right cache usage approach:

Do not relax your vigilance, it’s exactly what they are waiting for! (about bugs)

And how do you search through the hash for a key with specified value?

For the beginning, I’ll post a few key points about user profiles. If you want to add some content to the profile of specific user, you should call profile.setFBML routine. For users that you have not called profile.setFBML for, the actions are read from the content in “Default FBML” section of your application settings. For the most part, this will apply to any user who has not added your application. What is “Default FBML” itself? If you have added application, you will see “Default FBML” on all profiles of users that you have not called profile.setFBML for, and it does not matter, if they have added your application or not (good place to put “Invite” link). The same behavior you would see, if you would call profile.setFBML for all users (and if you are crazy enough.)

Please note, “Default FBML” is cached indefinitely, so wait some time to get your content on profiles. Another thing — you can add only action links to user profiles, that have not added your application, and only your application user will see them. This is most important part of the documentation, and you should completely understand it. More detailed description could be found in the documentation for fb:profile-action tag and profile.setFBML routine.

FBML-content for user profiles

There are 4 profile-specific FBML tags exist:

• fb:profile-action is used to add action links under the user picture.
• fb:subtitle will be shown right under the title of the your application box.
• fb:wide specifies content to be shown when your application box placed in wide column.
• fb:narrow specifies content to be shown when your application box placed in narrow column.

Easy, right? So let’s examine these tags more precisely.

As I said early, fb:profile-action is used to place action links on the user’s profile. Usually you will add one link:

What about following scenario: I want to see the link “View my products” when I’m looking my own profile, “View Taisia’s products”, if I’m looking profile of my wife Taisia (and she has added application too), and “Invite Roman to MyApp” when I’m looking profile of my friend Roman, and he has not added application. Here is the code:

Please note: this example is similar to example on the fb:profile-action documentation page, but has one big difference — it’s working: fb:if-is-app-user uid="profileowner" (in documentation example uid takes default value “loggedinuser”, but we need uid of the profile owner.)

This code will work completely only if you will put it into the “Default FBML” section of your application settings, or if you will call profile.setFBML for user, that has not added your application (but this is madness, what I have talked about early): I have specified action “Invite someone to MyApp” in section, which will be shown only on profile of user that has not added application.

BTW, do not forget to remove all line breaks before updating “Default FBML”, because Facebook replaces them with <br/>.

Another interesting thing you could see from working example: Facebook adds parameter id for all links in profile-action, and it equals to owner’s of the profile ID. In my previous example, if I will navigate to Roman’s profile, I will see hyperlink with URL http://apps.facebook.com/myapp/Invite.aspx?id=603839739. Great!

This example is simple, so let’s move ahead. We have two columns on the profile: left (narrow) and right (wide). You can specify in application settings which one will be default. To put content in wide column, use fb:wide, in narrow column — fb:narrow. Quite clear, right?

One more interesting issue. You can specify as many fb:wide and fb:narrow tags as you wish. All content, specified in fb:wide tags will be shown if you application box placed in wide column, all content from fb:narrow tags — when application box placed in narrow column. You can add content outside one of these tags, and it will be shown in both cases — when application in wide or narrow column. If no content specified for one of column, Facebook will show “No content to display.” text.

When to generate profile FBML?

Your application box on the user’s profile should reflect latest changes related to him. Facebook does not know when to update profile information, so you need to do it by yourself (anyway, only you as application developer know when something changes). So, usually you would call profile.setFBML after some changes in your application (for example, user or his friends added some data), depending on which information you are rendering on the profile. Sometimes it’s a good idea to set default data after user has added your application.

Creating profile FBML content with ASP.NET

For profile content generating I propose to use UserControls:

How to get string to put it into the profile.setFBML? Here is the code:

I’ve added control to the Controls collection to get events fired. If you would call this snippet from OnLoad, only OnInit would be fired in ProfileFBML, so do not forget to call DataBind method to force data binding from OnInit in this case.

Please note: my solution is just copy/past of the XmlHttpExecutor code with two small changes:

• I have passed false as third parameter of the XMLHttpRequest.open method to make synchronous call.
• I have cached request results in XMLHttpSyncExecutor members before freeing XMLHttpRequest in the _onReadyStateChange function.

So let’s get started. First of all we would define XMLHttpSyncExecutor class, descendant of the WebRequestExecutor.

This is very simple and clean, so I’ll just show you other methods of the XMLHttpSyncExecutor.

And finally we will notify ASP.NET AJAX that script have been loaded.

Usage is not so simple as wanted, but it’s still quite easy to understand:

When you are using ScriptService, you will not see these difficulties, because ASP.NET will generate wrappers by itself. But if you need synchronous AJAX call — sorry, but in this case you should do it manually. Sample solution could be found here.

ASP.NET (and as I know, Java, Ruby, etc) does not have built-in functionality for numeric strings localization. Yes, I know about Rubish pluralize, but it does not working for Russian, and I suspect for some other languages too. So I need to implement pluralization, desirable using ASP.NET resources, with simplest interface as possible. Adding new languages should be easy enough.

So, here is my idea. We will define several strings in our resources (Comments0, Comments1, Comments2, etc). We have some interface, for example IResourceIndexer. Interface has single method, which should return resource index by entities number. We have to implement this interface for different languages (English, Russian, etc). Then we need to create factory, which would return culture-specific IResourceIndexer. And latest step is to create static class with helper methods, which will return strings using number of entities. But seeing is believing. Let’s look at the code.

Here is interface. As you can see, it’s very simple — just single method, which returns resource index.

[lang_en]
Let’s implement indexers for English and Russian languages:
[/lang_en]
[lang_ru]
Давайте реализуем индексаторы для английского и русского языков:
[/lang_ru]

As you can see, Russian is more difficult than English :-) But it still easy enough to implement. Hope, for other languages we could do something like this without any problems. Please note, that I have added different resource indexes for 1 and 21 in Russian. Usually this is not needed, but I want to have ability to use string “минуту назад” for 1 and “21 минуту назад” for 21.

Now we need to define factory to get indexer using current culture (which could be accessed through Thread.CurrentThread.CurrentUICulture property).

As you can see, I’m detecting indexer using two letters ISO code. Of course, you can do more complex processing here. Please note, that English is default language in my application, you might need to change cases order. I’m using indexers cache in this code to avoid factory performance hit.

Almost finished. Now we need to define resources and implement helper class:

And resources:

Please note, that I have 5 resource strings in English strings file, in spite of only 3 really need. That’s because English is my default language, and to build my satellite assembly with Russian resources, I must have same string resources in both resource files.

Little more about usage. First you should initialize thread culture. In ASP.NET applications you should override method InitializeCulture and set Thread.CurrentThread.CurrentCulture and Thread.CurrentThread.CurrentUICulture properties:

In this case browser culture would be used (in Firefox — Tools/Options/Advanced/Languages -> Choose, add Russian or English as first language; in Internet Explorer it could be done here — Tools/Internet Options/Languages.) Now you can write something like this in .aspx file:

Full example project could be downloaded here. Have any comments?

First, we will create derived control and add property UseCustomPager, which will define whether or not to use Digg-style pagination:

GridView has virtual method InitializePager which could be overridden to create our custom pager:

Now let’s create our custom pager:

Several pager settings used in this code:

• PagerSettings.PreviousPageText — text to be shown on the “Previous” button.
• PagerSettings.NextPageText — text to be shown on the “Next” button.
• PagerSettings.PageButtonCount — how many pages to show before and after the current page.

You could see, that in BuildLinkButton method I have used custom control PagerLinkButton. This is just descendant of the LinkButton control which simplifies usage inside our GridViewWithPager:

Our control is almost done. All we need is to define method ParentBuildCallbackArgument. As you could see from GridView sources, this method is used for serializing page index, sort direction and sort expression, but for some reason, it has been defined as internal. I don’t like hacks, but in this case I think that I can cheat a little:

BTW, as you could see, I have not added any comments to methods. It is done specially, because I don’t want to create custom controls library, just sharing my experience :-)

And now I’ll show you example of usage:

And a screenshot:

Full source code could be downloaded here.

Let’s look how DefaultButton is working in ASP.NET. Here is simple example:

When you will try to press ENTER button inside the text box, form will be submitted to the server, but LinkButton‘s Click event will not be fired. Let’s try to specify DefaultButton property of the panel:

Great! It’s working perfectly in Internet Explorer, but what about Firefox? Oops, we found a problem. You could find solution at the end of the post, but first I want to show why this problem occurs. When you specify DefaultButton property, ASP.NET generates following code:

Here is WebForm_FireDefaultButton method, defined in ASP.NET JavaScript library:

The problem occurs in the code typeof(defaultButton.click) != "undefined" — Firefox does not define click() method for the a element, so the form will be submitted without __EVENTTARGET parameter, and button will not be triggered. The simplest way to solve the problem is to define click() method for the a:

Our click() method imitates a element behavior: first it calls onclick() method (OnClientClick attribute of the LinkButton), and if it returns false — stops processing. Then it evals href attribute (where ASP.NET puts __doPostBack call).

Let’s create custom control which encapsulates this logic:

And corresponding .aspx file:

Of course, JavaScript code should be moved out from the C# code, but for my example it’s good enough. If you are using ASP.NET AJAX library, you should use ScriptManager.RegisterStartupScript method instead of ClientScriptManager.RegisterStartupScript.

Hope, this post will help you. Your comments are welcome.